BEM naming for WordPress navigation menus.
Switch branches/tags
Clone or download
Benjamin Crozat
Benjamin Crozat Merge pull request #1 from craigpearson/hotfix/getPrefix-fatal-error
Fix return value for getPrefix()
Latest commit b7f7d3e Nov 23, 2017

README.md

Latest Stable Version License Total Downloads

BEM Walker Nav Menu

BEM naming for WordPress navigation menus.

Installation

You can manually download it and install it in your plugins folder or install it via Composer:

composer require benjamincrozat/bem-walker-nav-menu

Usage

<nav class="nav">
    <?php
    wp_nav_menu([
        'walker' => new BC\WordPress\BEMWalkerNavMenu,
    ]);

    // Will generate:
    // <ul id="..." class="nav__list">
    //     <li class="nav__item ... nav__item--123">
    //         <a href="..." class="nav__link">...</a>
    //         <ul class="sub-nav">
    //             <li class="sub-nav__item">
    // ...
    ?>
</nav>

Extend the class to change the HTML classes.

<?php

class CustomWalkerNavMenu extends \BC\WordPress\BEMWalkerNavMenu
{
    protected $prefix = 'c';

    protected $navListClass = 'menu__list';

    protected $navItemClass = 'menu__item';

    protected $navLinkClass = 'menu__link';

    protected $subNavClass = 'sub-menu';

    protected $subNavItemClass = 'sub-menu__item';

    protected $subNavLinkClass = 'sub-menu__link';
}

License

WTFPL