Добавить дополнительный div в элементы навигации WordPress

#wordpress #wordpress-theming #wp-nav-menu-item

#wordpress #wordpress-тематизация #wp-nav-menu-item

Вопрос:

Какой самый простой способ изменить вывод, созданный моим wp-меню, из

 <ul class="primary-menu">
<li class="menu-item">
    <a href="">nav link</a>
    <ul class="sub-menu"></ul>
</li>
</ul>
  

Для

 <ul class="primary-menu">
<li class="menu-item">
    <div class="alignme">
        <button></button><a href=""></a><button></button>
    </div>
    <ul class="sub-menu"></ul>
</li>
</ul>
  

?

Мне нужен такой «вспомогательный div», потому что я должен выровнять три элемента определенным образом и независимо от возможного дополнительного содержимого (например, подменю) внутри li.

Я использую wp_nav_menu () по умолчанию, и как создатель темы в первый раз, я понятия не имею, где найти «настройки» меню. Есть идеи, на что мне следует обратить внимание?

Комментарии:

1. вы можете использовать функцию WordPress wp_nav_menu() для ссылки на этот URL developer.wordpress.org/reference/functions/wp_nav_menu

Ответ №1:

добавьте класс walker в wp_nav_menu «новый Add_Div_Walker». проверьте мой приведенный ниже код.

 $menu = array(
    'theme_location'  => 'primary',
    'items_wrap'      => '<ul id="%1$s" class="%2$s">%3$s</ul>',
    'walker'          => new Add_Div_Walker
);
wp_nav_menu( $menu );

// add this below code in your functions.php file.
class Add_Div_Walker extends Walker_Nav_Menu {
    function start_lvl( amp;$output, $depth = 0, $args = array() ) {
        $indent = str_repeat("t", $depth);
        $output .= "n$indent<div class='alignme'>
            <button></button><a href=''></a><button></button>
        </div><ul class='submenu'>n";
    }
    function end_lvl( amp;$output, $depth = 0, $args = array() ) {
        $indent = str_repeat("t", $depth);
        $output .= "$indent</ul>n";
    }
}