Bagaimana cara menambahkan sub-menu ke menu yang dibuat oleh wp_nav_menu dengan menggunakan plugin


11

Saya memiliki menu yang dihasilkan wp_nav_menuseperti apa

<ul class="nav-menu" id="menu-top-nav">
    <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-43" id="menu-item-43"><a href="http://www.example.com/item1.com">Item 1</a></li>
    <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-44" id="menu-item-44"><a href="http://www.example.com/item2.com">Item 2</a></li>
    <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-45" id="menu-item-45"><a href="http://www.example.com/item3.com">Item 3</a></li>
    <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-46" id="menu-item-46"><a href="http://www.example.com/item4.com">Item 4</a></li>
</ul>

Saya ingin memodifikasi menu di atas dengan menambahkan sub-menu ke "Item 3" menggunakan plugin saya, jadi di bawah ini adalah output yang saya inginkan.

<ul class="nav-menu" id="menu-top-nav"><li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-43" id="menu-item-43"><a href="http://www.example.com/item1.com">Item 1</a></li>
  <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-44" id="menu-item-44"><a href="http://www.example.com/item2.com">Item 2</a></li>
  <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-45" id="menu-item-45"><a href="http://www.example.com/item3.com">Item 3</a>
    <ul class="sub-menu">
      <li class="menu-item" id="menu-item-48"><a href="http://www.example.com/child1.com">child 1</a></li>
      <li class="menu-item" id="menu-item-49"><a href="http://www.example.com/child2.com">child 2</a></li>
      <li class="menu-item" id="menu-item-50"><a href="http://www.example.com/child3.com">child 3</a></li>
   </ul>
  </li>
  <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-46" id="menu-item-46"><a href="http://www.example.com/item4.com">Item 4</a></li>
</ul>

Saya telah mencoba mengikuti filter tetapi ini tidak membantu saya untuk mencapai hasil di atas.

wp_setup_nav_menu_item
wp_get_nav_menu_items
wp_nav_menu_items

Penanganan masalah 1:

add_filter('wp_nav_menu_items', 'my_custom_menu_item', 10, 2);

function my_custom_menu_item($items, $args)
{
    $parent_item_number = 3;
    $pos = nth_strpos($items, '</a>', $parent_item_number) + 4;
    $cat_id = 9;
    $args = array('numberposts' => 5, 'category' => $cat_id);
    $myposts = get_posts($args);
    if (!empty($myposts))
    {
        $str_to_insert = '<ul class="sub-menu">';
        global $post;
        foreach ($myposts as $post) : 
            setup_postdata($post);
            $str_to_insert .= '<li><a href="' . get_permalink() . '">' . get_the_title() . '</a></li>';
        endforeach;
        $str_to_insert .= '</ul>';

        $items = substr($items, 0, $pos) . $str_to_insert . substr($items, $pos);
    }
    return $items;
}

function nth_strpos($str, $substr, $n, $stri = false)
{
    if ($stri)
    {
        $str = strtolower($str);
        $substr = strtolower($substr);
    }
    $ct = 0;
    $pos = 0;
    while (($pos = strpos($str, $substr, $pos)) !== false)
    {
        if (++$ct == $n)
        {
            return $pos;
        }
        $pos++;
    }
    return false;
}

Solusi di atas berfungsi tetapi saya pikir itu bukan cara yang tepat untuk mencapai hasil yang diinginkan. Saya ingin mendapat solusi yang baik dari Anda.


Wow, jadi tidak ada jawaban lain untuk pertanyaan ini? Saya juga mencari solusi sederhana di sini. Sesuatu yang tidak melibatkan string parsing. Pasti ada cara yang lebih mudah, bukan?
rgin

Dukungan WP untuk menghapus struktur html ini. Penanganannya hanya perlu mengubah nama kelas submenu css. Lebih baik menulis ulang kelas css Anda untuk struktur menu wordpress.
Foxsk8

Jawaban:


2

Anda dapat memodifikasi menu dengan menggunakan walker.

include('subMenu.php');
$menu =  wp_nav_menu( array('menu' => 'YOUR-MENU-NAME','menu_class' => 'megamenu','walker' => new subMenu));

buat file subMenu.php di folder tema tambahkan kode di bawah ini.

<?php
class subMenu extends Walker_Nav_Menu {
    function end_el(&$output, $item, $depth=0, $args=array()) {

    if( 'Item 3' == $item->title ){
        $output .= '<ul class="sub-menu">
        <li class="menu-item" id="menu-item-48"><a href="http://www.example.com/child1.com">child 1</a></li>
        <li class="menu-item" id="menu-item-49"><a href="http://www.example.com/child2.com">child 2</a></li>
        <li class="menu-item" id="menu-item-50"><a href="http://www.example.com/child3.com">child 3</a></li>
        </ul>';
    }
    $output .= "</li>\n";  
    }
}

0

Hook wp_nav_menu_itemsbenar jika Anda akan menambahkan item ke struktur WP Nav Menu. Lihat contoh di bawah ini untuk menambahkan tautan "Rumah" statis. Tautan bersifat statis, dari fungsi home_url()dan saya empeded ini hanya dalam argumen dari WP Nav Menu nilai-nilai sebelum dan sesudah. Item-li bersifat statis, hanya tersedia di WordPress, jika Anda menggunakan Walker untuk elemen ini. Pengait wp_nav_menu_itemsada di dalam daftar ul. Setelah menentukan var untuk konten item baru ini saya menambahkan ini ke daftar default di var $items, atur sebelum output daftar. Sekarang hanya pengembalian semua konten.

add_filter( 'wp_nav_menu_items', 'fb_add_home_link', 10, 2 );
function fb_add_home_link( $items, $args ) {

    $home_item =
            '<li>' .
            $args->before .
            '<a href="' . home_url( '/' ) . '" title="Home">' .
            $args->link_before . __( 'Home' ) . $args->link_after .
            '</a>' .
            $args->after .
            '</li>';

    $items = $home_item . $items;

    return $items;
}

Tampaknya Anda tidak membaca pernyataan masalah saya sehingga solusi Anda tidak seperti yang saya inginkan, saya tidak perlu melampirkan item di awal atau akhir menu tetapi saya perlu sub-menu di bawah item induk tertentu. Silakan baca pertanyaannya, semua hal dijelaskan dengan sangat jelas.
Tahir Yasin

Maaf, ya Anda benar; tetapi seringkali masalah bahasa latar belakang. Tapi saya akan mencari solusinya.
bueltge
Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.