Ondersteuning » Code oplossingen gezocht » wp_nav_menu() toont “#” in item met kinderen

  • Hallo, ik zoek hulp. (Ik zat waarschijnlijk in het verkeerde forum te vragen – excuses daarvoor.
    En ik moet nog toevoegen: in functions.php heb ik deze regel: require_once('wp_bootstrap_navwalker.php');
    Deze code:

    <div class="blog-masthead">
          <div class="container">
            <nav class="blog-nav">
              <?php
                wp_nav_menu(array(
                  'menu'              => 'primary',
                  'theme_location'    => 'primary',
                  'depth'             => 2,
                  'container'         => 'div',
                  'container_class'   => 'collapse navbar-collapse',
                  'container_id'      => 'bs-example-navbar-collapse-1',
                  'menu_class'        => 'nav navbar-nav',
                  'fallback_cb'       => 'WP_Bootstrap_Navwalker::fallback',
                  'walker'            => new WP_Bootstrap_Navwalker()
                ));
              ?>
            </nav>
          </div>
        </div>

    genereert deze HTML:

    <div class="blog-masthead">
          <div class="container">
            <nav class="blog-nav">
              <div id="bs-example-navbar-collapse-1" class="collapse navbar-collapse"><ul id="menu-main-menu" class="nav navbar-nav"><li id="menu-item-118" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-home current-menu-item page_item page-item-113 current_page_item menu-item-118 active"><a title="Thuis" href="http://localhost/wpthemes/">Thuis</a></li>
    <li id="menu-item-117" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-117"><a title="Berichten" href="http://localhost/wpthemes/berichten/">Berichten</a></li>
    <li id="menu-item-96" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-96 dropdown"><a title="Over ons" href="#" data-toggle="dropdown" class="dropdown-toggle" aria-haspopup="true">Over ons <span class="caret"></span></a>
    <ul role="menu" class=" dropdown-menu">
    	<li id="menu-item-97" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-97"><a title="Diensten" href="http://localhost/wpthemes/over-ons/dienstencentrum/">Diensten</a></li>
    	<li id="menu-item-98" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-98"><a title="Team" href="http://localhost/wpthemes/over-ons/team/">Team</a></li>
    </ul>
    </li>
    <li id="menu-item-94" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-94"><a title="Voorbeeldpagina" href="http://localhost/wpthemes/voorbeeldpagina/">Voorbeeldpagina</a></li>
    </ul></div>        </nav>
          </div>
        </div>

    (een hele lap, hè) – wat ik eigenlijk wil weten:
    <a title="Over ons" href="#" data-toggle="dropdown" class="dropdown-toggle" aria-haspopup="true">Over ons <span class="caret"></span></a>

    Hoe komt het dat hier href="#" wordt gegenereerd, ik wil daar ook een link naar de pagina Over ons.
    Moet ik iets veranderen / toevoegen in de array die de opties weergeeft?

    Mijn dank,
    Met vriendelijke groet,
    Ad Rienks

4 reacties aan het bekijken - 1 tot 4 (van in totaal 4)
  • Heb je al eens gekeken via “Weergave” > “Customizer” > “Menu’s” en dan bij het betreffende menu? Daar staan je menu items die je ook handmatig kunt voorzien van links. Allicht staat daar een #.

    Thread starter kwibus

    (@kwibus)

    @ruurd: bedankt, maar dat is het niet volgens mij. Kijk maar; in de customizer zie ik duidelijk een link naar over-ons staan. (Helaas kan ik hier geen screenshotje uploaden!)

    Ad

    Je gebruikt bootstrap om een menu op te bouwen. Dit zorgt waarschijnlijk voor dit gedrag. Bootstrap werkt namelijk met een click event welke de dropdown triggert. Kijk anders eens of het toevoegen van het volgende script helpt bij je probleem (deze dient gekopieerd en geplakt te worden in bijvoorbeeld de header.php of footer.php van je thema):

    <script>
    $( ".dropdown-submenu" ).click(function(event) {
        // stop bootstrap.js to hide the parents
        event.stopPropagation();
        // hide the open children
        $( this ).find(".dropdown-submenu").removeClass('open');
        // add 'open' class to all parents with class 'dropdown-submenu'
        $( this ).parents(".dropdown-submenu").addClass('open');
        // this is also open (or was)
        $( this ).toggleClass('open');
    });
    </script>
    • Deze reactie is gewijzigd 6 jaren, 10 maanden geleden door Ruurd de Wind.
    • Deze reactie is gewijzigd 6 jaren, 10 maanden geleden door Ruurd de Wind.
    Thread starter kwibus

    (@kwibus)

    @ruurd: ik vind het heel aardig dat je meedenkt, maar dit werkt helaas ook niet.

    De oorzaak dat de link naar de pagina Over ons niet wordt gemaakt, moet volgens mij toch zeer waarschijnlijk liggen in de opties die als een array aan wp_nav_menu() meegegeven worden.
    Maar welke optie? Moet er iets bij? Of juist iets af? Ik weet het echt niet. ;-(

    Bedankt,
    Ad

4 reacties aan het bekijken - 1 tot 4 (van in totaal 4)
  • Het onderwerp ‘wp_nav_menu() toont “#” in item met kinderen’ is gesloten voor nieuwe reacties.