Jak dodać podmenu do menu generowanego przez wp_nav_menu przy użyciu wtyczki

11

Mam wygenerowane menu, za pomocą wp_nav_menuktórego wyglądają

<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>

Chcę zmodyfikować powyższe menu, dodając podmenu do „Pozycji 3” za pomocą mojej wtyczki, więc poniżej jest moje pożądane wyjście.

<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>

Próbowałem zastosować następujące filtry, ale nie pomogły mi to osiągnąć powyższego wyniku.

wp_setup_nav_menu_item
wp_get_nav_menu_items
wp_nav_menu_items

Obejście 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;
}

Powyższe rozwiązanie działa, ale myślę, że nie jest to właściwy sposób na osiągnięcie pożądanego rezultatu. Chciałbym mieć od ciebie dobre rozwiązanie.

Tahir Yasin
źródło
Wow, więc nie ma innej odpowiedzi na to pytanie? Szukam również prostego obejścia tego problemu. Coś, co nie wymaga analizowania ciągów. Musi być prostszy sposób, prawda?
rgin
Wsparcie WP na defoult tej strukturze HTML. Obejście wymaga jedynie zmiany nazw klas podmenu css. Lepiej przepisz swoje klasy css dla struktury menu wordpress.
Foxsk8

Odpowiedzi:

2

Możesz zmodyfikować swoje menu za pomocą Walkera.

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

utwórz plik subMenu.php w folderze motywów dodaj poniższy kod.

<?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";  
    }
}
Addy
źródło
0

Hak wp_nav_menu_itemsma rację, jeśli dodasz elementy do struktury menu WP Nav. Zobacz poniższy przykład, aby dodać statyczny link „Strona główna”. Link jest statyczny, z funkcji, home_url()i ujęłam to tylko w argumentach z WP Nav Menu fpr wartości przed i po. Element li jest statyczny, jest podzielony tylko w WordPress, jeśli używasz Walkera dla tego elementu. Hak wp_nav_menu_itemsznajduje się na liście ul. Po zdefiniowaniu zmiennej dla tej nowej pozycji elementu dodam ją do domyślnej listy w zmiennej $items, ustawionej przed wyjściem listy. Teraz tylko zwrot całej zawartości.

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;
}
bueltge
źródło
Wygląda na to, że nie przeczytałeś mojego oświadczenia o problemie, więc twoje rozwiązanie nie jest tym, czego chcę, nie muszę dołączać elementu na początku lub na końcu menu, ale potrzebuję podmenu pod określonym elementem nadrzędnym. Proszę przeczytać pytanie, wszystkie rzeczy są wyjaśnione bardzo jasno.
Tahir Yasin
Przepraszam, tak, masz rację; ale często problem językowy stanowi tło. Ale znajdę rozwiązanie.
bueltge