Sage 8 : Navigation Bootstrap

Pour générer un menu de navigation bootstrap avec Sage 8, vous aurez d’appeler un Navwalker pour obtenir le rendu HTML attendu.

Télécharger le fichier class-wp-bootstrap-navwalker.php et l’installer dans le répertoire /lib de votre thème.

Loader le fichier à partir de functions.php :

$sage_includes = [
  'lib/cpt.php',       // CPT
  'lib/assets.php',    // Scripts and stylesheets
  'lib/extras.php',    // Custom functions
  'lib/setup.php',     // Theme setup
  'lib/titles.php',    // Page titles
  'lib/wrapper.php',   // Theme wrapper class
  'lib/customizer.php', // Theme customizer
  'lib/class-wp-bootstrap-navwalker.php'
];

Modifier le fichier templates/header.php pour appeler le nouveau walker :

<header class="banner">
  <nav class="navbar navbar-expand-lg navbar-dark navbar-uwinpronos fixed-top">
    <a class="brand navbar-brand" href="<?= esc_url(home_url('/')); ?>" alt="<?php bloginfo('name'); ?>">BRAND NAME</a>
    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarMenu" aria-controls="navbarMenu" aria-expanded="false" aria-label="Toggle navigation">
      <span class="navbar-toggler-icon"></span>
    </button>

    <div class="collapse navbar-collapse" id="navbarMenu">
      <?php
        if (has_nav_menu('primary_navigation')) :
          wp_nav_menu([
          'theme_location'  => 'primary_navigation', 
          'walker'          => new WP_Bootstrap_Navwalker(), 
          'menu_class'      => 'nav navbar-nav ml-auto',
          ]);
        endif;
      ?>
    </div>
  </nav>
</header>