WordPress пользовательское меню Walker

Весь день я изо всех сил пытаюсь создать пользовательское меню, которое будет соответствовать разметке, которая должна быть на внешнем интерфейсе.

Вот желаемая разметка:

<nav class="menu cf">
<div class="menu__inner cf">
    <ul class="menu__list">
        <li class="menu__item menu__item--first">
            <a href="" class="menu__link">Menu item 1</a>
        </li>

        <li class="menu__item menu__item--has_children cf">
            <a href="" class="menu__link">
                Menu item 2
            </a>

            <a href="" class="menu__link--toggle">
                <i class="icon-arrow-thin-down"></i>
            </a>

            <div class="sub_menu__wrap">
                <div class="container">
                    <div class="gr-12 gr-3@lg">
                        <div class="sub_menu__heading">Menu heading (parent menu title)</div>
                    </div>
                    <div class="gr-12 gr-9@lg">
                        <ul class="sub_menu">
                            <li class="sub_menu__item gr-12 gr-4@lg">
                                <a href="" class="sub_menu__link">Submenu item 1</a>
                            </li>
                            <li class="sub_menu__item gr-12 gr-4@lg">
                                <a href="" class="sub_menu__link">Submenu item 2</a>
                            </li>
                            <li class="sub_menu__item gr-12 gr-4@lg">
                                <a href="" class="sub_menu__link">Submenu item 3</a>
                            </li>
                            <li class="sub_menu__item gr-12 gr-4@lg">
                                <a href="" class="sub_menu__link">Submenu item 4</a>
                            </li>
                            <li class="sub_menu__item gr-12 gr-4@lg">
                                <a href="" class="sub_menu__link">Submenu item 5</a>
                            </li>

                        </ul>
                    </div>
                </div>
            </div>
        </li>

        <li class="menu__item menu__item--last">
            <a href="" class="menu__link">Menu item 3</a>
        </li>
    </ul>
</div>

У меня есть несколько примеров пользовательских классов, расширяющих Walker_Nav_Menu, но я думаю, что эти примеры бесполезны.

Вот что у меня есть: http://pastebin.com/qnPx9J67

ВАЖНЫЙ! Я хочу иметь методологию БЭМ на моих уроках, например:

$menuListClass    = 'menu__list';
$menuItemClass    = 'menu__item';
$menuLinkClass    = 'menu__link';
$subMenuClass     = 'sub_menu';
$subMenuClass     = 'sub_menu';
$submenuItemClass = 'sub_menu__item';
$subMenuLinkClass = 'sub_menu__link';

Я также хочу сохранить некоторые классы Wordpress по умолчанию, но в этом формате: Примеры:

.menu-item-has-children -> .menu__item--has_children
.current-menu__item -> .menu__item--current

Я надеюсь, что кто-то может помочь мне с этим, так как я не знаю очень хороший PHP.:)

Ссылка на источник: https://developer.wordpress.org/reference/classes/walker_nav_menu/

0 ответов

Другие вопросы по тегам