Menu with subitems

  • I have menu with subitems, like this:
    MenuItem
    |-SubItem
    |-SubItem
    – where every item (MenuItem and SubItems) must be a link.
    By default MenuItem has ‘a’ tag with “#” in href parameter.

    I made some changes in ../inc/wp_bootstrap_navwalker.php:

    // If item has_children add atts to a.
    if ( $args->has_children && $depth === 0 )
    $atts['href']  = $item->url;

    (changed from ‘#’; to $item->url;)
    – after that MenuItem becomes link, but don’t work.

    If i comment two lines in this section:

    $atts['href']  = $item->url;
    // $atts['data-toggle'] = 'dropdown';
    // $atts['class']  = 'dropdown-toggle';
    $atts['aria-haspopup'] = 'true';

    – then main MenuItem works, but i can’t use submenu items via popup.

    Is it possible to make then: first click on MenuItem will open submenu popup, second click on MenuItem will open MenuItem-link?

    • This topic was modified 3 years, 12 months ago by feder. Reason: additions
    • This topic was modified 3 years, 12 months ago by feder. Reason: add default value

    Yes unfortunately with this menu script if you use one method you can use the other.

    This menu is made for mobile devices. On a mobile device if you click on a parent menu it should dropdown the child items. Otherwise you wouldn’t be able to access then.

    What I recommend you do is switch it out for another menu.

    You can use ShiftNav – Responsive Menu Plugin.

    https://wordpress.org/plugins/shiftnav-responsive-mobile-menu/

    And switch it out in the header.php file.

    Hope that helps.

    Thanx, than maybe it’s possible to expand popup SubMenu on focus?

    Yes ShiftNav uses an elegant shift-out navigation.

    It displays the parent and child menu items at the same time.

    Once you enable it you will see how it works.

    Hans, thanks for the advice, i tried ShiftNav…but this decision is even worse that it was by default: ShiftNav doesn’t work correctly with my multilanguage plugin integrated in menu (Stella plugin) and doesn’t work in mobile browser (empty menu in Opera Mobile).

    Default navbar works fine in all browsers. Maybe is it possible to change some code for correct working with submenus? Is it bootstrap’s javascript?

    Yes it uses the Bootstrap Nav Walker script.

    You can find more information here, https://github.com/twittem/wp-bootstrap-navwalker

Tagged: 

You must be logged in to reply to this topic.