0

I am trying to apply to my already existing menu a walker in order to add custom classes to every sub menu anchor tag.

Here is my menu:

            wp_nav_menu(array(
            'theme_location' => 'menu-top',
            'container'      => 'ul',
            'menu_class'     => 'header_nav_ul',
            'menu_id'        => 'header_nav_id',
            'depth'          => 0,
        ))

I added the wolder and it became:

wp_nav_menu(array(
            'theme_location' => 'menu-top',
            'container'      => 'ul',
            'menu_class'     => 'header_nav_ul',
            'menu_id'        => 'header_nav_id',
            'depth'          => 0,
            'walker'        => new my_walker_nav_menu_start_el(),
        ))

The walker function is this one:

function my_walker_nav_menu_start_el($item_output, $item, $depth, $args) {
        // you can put your if statements in here (use item, depth and args in conditions)
        if ( $depth == 1 ) {
            $item_output = preg_replace('/<a /', '<a class="level-1-menu" ', $item_output, 1);
        } else if ( $depth == 2 ){
            $item_output = preg_replace('/<a /', '<a class="level-2-menu" ', $item_output, 1);
        }
        // .. and so on
        return $item_output;
    }
    add_filter('walker_nav_menu_start_el', 'my_walker_nav_menu_start_el', 10, 4);

However out of the box it doesn't work. I am new to php, but I see that it is a new walker which suggests me that I should write that function as a class.

Can anyone help me to edit my function so that it will work fine with my menu?

Thank you

0

You're right, it's the object-oriented parts that are throwing you off.

The nav menu call should be:

wp_nav_menu(array(
    'theme_location' => 'menu-top',
    'container'      => 'ul',
    'menu_class'     => 'header_nav_ul',
    'menu_id'        => 'header_nav_id',
    'depth'          => 0,
    'walker'         => new my_walker_nav_menu_start_el,
));
  • no parentheses () after the name of the walker.

The walker itself needs to extend Core's Walker_Nav_Menu, and there is no add_filter() call for it.

// Extend the existing Core class, to build on its functionality
class my_walker_nav_menu_start_el extends Walker_Nav_Menu {
    // Make the function public so it can be called elsewhere
    public function start_el($item_output, $item, $depth = 0, $args = array(), $id = 0) {
        if ( $depth == 1 ) {
            $item_output = preg_replace('/<a /', '<a class="level-1-menu" ', $item_output, 1);
        } else if ( $depth == 2 ) {
            $item_output = preg_replace('/<a /', '<a class="level-2-menu" ', $item_output, 1);
        }
        return $item_output;
    }
}
// Remove the add_filter() call as it's not used

Just make sure the links don't have any other class, or else you'll end up with links that have 2 "class" attributes.

| improve this answer | |
  • hmm, getting this error now Fatal error : Uncaught ArgumentCountError: Too few arguments to function my_walker_nav_menu_start_el::my_walker_nav_menu_start_el(), 0 passed in – Pikk May 20 at 13:56
  • Updated above, looks like you didn't originally have enough arguments passed to the public function. – WebElaine May 20 at 14:17
  • now instead of a fatal error, instead of the menu appears a warning: Warning: Declaration of my_walker_nav_menu_start_el::start_el($item_output, $item, $depth = 0, $args = Array, $id = 0) should be compatible with Walker_Nav_Menu::start_el(&$output, $item, $depth = 0, $args = NULL, $id = 0) in C:\xampp\htdocs\ssd\wp-content\themes\mytheme\functions.php on line 21 – Pikk May 20 at 14:21
  • I added & => public function start_el(&$item_output, $item, $depth = 0, $args = array(), $id = 0) No warning anymore, but the whole menu now disappeared – Pikk May 20 at 14:39
  • Sounds like we might be using different versions of WP Core, for the number of arguments. You might want to look closer at the Codex or even the Core code for the start_el() function and copy that, then add in your depth conditional with output updates. – WebElaine May 20 at 16:29

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.