How to restore the Bootstrap nav [walkthrough]

smutek · May 19, 2017, 5:48pm

I recently put this together and have been meaning to share it here. It’s based on Soils clean nav and Michael Romero’s Sageextras plugin.

Basic output looks like:

- ul id="menu-main" class="navbar-nav mr-auto"
  -  li class="nav-item menu-item menu-page-1"
    - a class="nav-link"

It also supports drop downs.

Setup should be pretty self explanatory, but I’m going to update my original post, or make a new one, this weekend. In the mean-time, header markup and instructions are in the full gist. Hope this is helpful.

gist.github.com

https://gist.github.com/smutek/cd95c8bc4f1db70ee1eda2740bfbf6fd

Bootstrap4Nav-Sage9.md

## Credit
This is a frankensteind version of the current [Soil](https://github.com/roots/soil) nav walker, by the Roots team, and Michael Remoero's [Sagextras](https://github.com/storm2k/sagextras) walker. All credit goes to those good folks. :)

## Use

- Replace the contents of header.blade.php with the attached header.
- Copy the walker.php file to the /app directory.
- Add `walker.php` to the [Sage required files array](https://github.com/roots/sage/blob/master/resources/functions.php) in `resources/functions.php` - eg. on a stock Sage install the entry would look like:  
```php
/**

This file has been truncated. show original

header.blade..php

<nav class="navbar navbar-toggleable-md navbar-light bg-faded">

  <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse"
          data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false"
          aria-label="Toggle navigation">
    <span class="navbar-toggler-icon"></span>
  </button>

  <a class="navbar-brand" href="{{ home_url('/') }}">{{ get_bloginfo('name', 'display') }}</a>

This file has been truncated. show original

walker.php

<?php

namespace App;

/**
 * Class NavWalker
 * 
 * Bootstrap 4 walker with cleaner markup for wp_nav_menu()
 * For use with Sage >= 8.5
 *

This file has been truncated. show original