WordPress Nav Walker - Top menu link with dropdown link not clickable (dropdown opens)

admin管理员组

文章数量:1200819

I'm trying to setup a WP NAV WALKER with dropdowns. The links work fine, the dropdowns work fine, however the parents of dropdowns should also have links, but they don't trigger, instead, they just open the dropdowns. The goal would be that the arrows open the dropdowns, and clicking on the a tag results in the parent page opening.

Code:

class Walker_Nav_primary extends Walker_Nav_menu {


    function start_lvl( &$output, $depth = 0, $args = array() ) {
        // ul
        $indent  = str_repeat( "\t", $depth );
        $submenu = ( $depth > 0 ) ? ' sub-menu' : '';
        $output .= "\n$indent<ul class=\"dropdown-menu$submenu depth_$depth\">\n";
    }

    function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) {
        // li a span

        $indent = ( $depth ) ? str_repeat( "\t", $depth ) : '';

        $li_attributes = '';
        $class_names   = $value = '';

        $classes = empty( $item->classes ) ? array() : (array) $item->classes;

        $classes[] = ( $args->walker->has_children ) ? 'dropdown' : '';
        $classes[] = ( $item->current || $item->current_item_ancestor ) ? 'active' : '';
        $classes[] = 'menu-item-' . $item->ID;
        if ( $depth && $args->walker->has_children ) {
            $classes[] = 'dropdown-submenu';
        }

        $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) );
        $class_names = ' class="' . esc_attr( $class_names ) . '"';

        $id = apply_filters( 'nav_menu_item_id', 'menu-item-' . $item->ID, $item, $args );
        $id = strlen( $id ) ? ' id="' . esc_attr( $id ) . '"' : '';

        $output .= $indent . '<li' . $id . $value . $class_names . $li_attributes . '>';

        $attributes  = ! empty( $item->attr_title ) ? ' title="' . esc_attr( $item->attr_title ) . '"' : '';
        $attributes .= ! empty( $item->target ) ? ' target="' . esc_attr( $item->target ) . '"' : '';
        $attributes .= ! empty( $item->xfn ) ? ' rel="' . esc_attr( $item->xfn ) . '"' : '';
        $attributes .= ! empty( $item->url ) ? ' href="' . esc_attr( $item->url ) . '"' : '';

        $attributes .= ( $args->walker->has_children ) ? ' class="dropdown-toggle" data-toggle="dropdown"' : ''; // THE PROBLEM!



        $item_output  = $args->before;
        $item_output .= '<a' . $attributes . '>';
        $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after;
        $item_output .= ( $depth == 0 && $args->walker->has_children ) ? ' <b class="caret"></b></a>' : '</a>';
        $item_output .= $args->after;

        $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args );

    }

}

I was able to narrow down the issue to this line:

$attributes .= ( $args->walker->has_children ) ? ' class="dropdown-toggle" data-toggle="dropdown"' : '';

If I remove it, then the parent links work, however, the dropdowns don't.

Anyone have any ideas?

Wp_nav_menu code:

        wp_nav_menu(
            array(
                'theme_location'  => 'primary-menu',
                'container_class' => false,
                'menu_class'      => 'sidebar-list nav navbar-nav navbar-right',
                'depth'           => 0,
                'falback_cb'      => false,
                'add_li_class'    => 'sidebar-item sidebar-anchor',
                'walker'          => new Walker_Nav_primary(),

            )
        );

Thanks!

I'm trying to setup a WP NAV WALKER with dropdowns. The links work fine, the dropdowns work fine, however the parents of dropdowns should also have links, but they don't trigger, instead, they just open the dropdowns. The goal would be that the arrows open the dropdowns, and clicking on the a tag results in the parent page opening.

Code:

class Walker_Nav_primary extends Walker_Nav_menu {


    function start_lvl( &$output, $depth = 0, $args = array() ) {
        // ul
        $indent  = str_repeat( "\t", $depth );
        $submenu = ( $depth > 0 ) ? ' sub-menu' : '';
        $output .= "\n$indent<ul class=\"dropdown-menu$submenu depth_$depth\">\n";
    }

    function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) {
        // li a span

        $indent = ( $depth ) ? str_repeat( "\t", $depth ) : '';

        $li_attributes = '';
        $class_names   = $value = '';

        $classes = empty( $item->classes ) ? array() : (array) $item->classes;

        $classes[] = ( $args->walker->has_children ) ? 'dropdown' : '';
        $classes[] = ( $item->current || $item->current_item_ancestor ) ? 'active' : '';
        $classes[] = 'menu-item-' . $item->ID;
        if ( $depth && $args->walker->has_children ) {
            $classes[] = 'dropdown-submenu';
        }

        $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) );
        $class_names = ' class="' . esc_attr( $class_names ) . '"';

        $id = apply_filters( 'nav_menu_item_id', 'menu-item-' . $item->ID, $item, $args );
        $id = strlen( $id ) ? ' id="' . esc_attr( $id ) . '"' : '';

        $output .= $indent . '<li' . $id . $value . $class_names . $li_attributes . '>';

        $attributes  = ! empty( $item->attr_title ) ? ' title="' . esc_attr( $item->attr_title ) . '"' : '';
        $attributes .= ! empty( $item->target ) ? ' target="' . esc_attr( $item->target ) . '"' : '';
        $attributes .= ! empty( $item->xfn ) ? ' rel="' . esc_attr( $item->xfn ) . '"' : '';
        $attributes .= ! empty( $item->url ) ? ' href="' . esc_attr( $item->url ) . '"' : '';

        $attributes .= ( $args->walker->has_children ) ? ' class="dropdown-toggle" data-toggle="dropdown"' : ''; // THE PROBLEM!



        $item_output  = $args->before;
        $item_output .= '<a' . $attributes . '>';
        $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after;
        $item_output .= ( $depth == 0 && $args->walker->has_children ) ? ' <b class="caret"></b></a>' : '</a>';
        $item_output .= $args->after;

        $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args );

    }

}

I was able to narrow down the issue to this line:

$attributes .= ( $args->walker->has_children ) ? ' class="dropdown-toggle" data-toggle="dropdown"' : '';

If I remove it, then the parent links work, however, the dropdowns don't.

Anyone have any ideas?

Wp_nav_menu code:

        wp_nav_menu(
            array(
                'theme_location'  => 'primary-menu',
                'container_class' => false,
                'menu_class'      => 'sidebar-list nav navbar-nav navbar-right',
                'depth'           => 0,
                'falback_cb'      => false,
                'add_li_class'    => 'sidebar-item sidebar-anchor',
                'walker'          => new Walker_Nav_primary(),

            )
        );

Thanks!

• menus
• walker

Share Improve this question asked Jun 22, 2022 at 13:15 Pbalazs89Pbalazs89 11511 silver badge1212 bronze badges

Add a comment  | 

1 Answer 1

Sorted by: Reset to default 1

Managed to fix it by updating the following:

$attributes .= ( $args->walker->has_children ) ? ' class="dropdown-toggle" data-toggle="dropdown"' : ''; // THE PROBLEM!

to:

$attributes .= ( $args->walker->has_children ) ? ' ' : ''; // THE PROBLEM!

And the fourth $item_output to:

$item_output .= ( $depth == 0 && $args->walker->has_children ) ? ' </a><b class="caret dropdown-toggle" data-toggle="dropdown"></b>' : '</a>';

Combined this with the following jQuery:

jQuery(document).ready(function () {
  jQuery(".dropdown > a").click(function () {
    window.location = jQuery(this).attr("href");
  });

 
});

It does the trick. Probably not the best way, but it works. Hipp-hipp.

本文标签： WordPress Nav WalkerTop menu link with dropdown link not clickable (dropdown opens)