PHPackages                             jorgelsaud/bootstrap-nav-walker - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Utility &amp; Helpers](/categories/utility)
4. /
5. jorgelsaud/bootstrap-nav-walker

ActiveLibrary[Utility &amp; Helpers](/categories/utility)

jorgelsaud/bootstrap-nav-walker
===============================

Bootstrap Nav Walker for wordpress

2.5.1(9y ago)49961[1 issues](https://github.com/giorgiosaud/bootstrapNavWalker/issues)MITPHP

Since May 9Pushed 9y ago1 watchersCompare

[ Source](https://github.com/giorgiosaud/bootstrapNavWalker)[ Packagist](https://packagist.org/packages/jorgelsaud/bootstrap-nav-walker)[ RSS](/packages/jorgelsaud-bootstrap-nav-walker/feed)WikiDiscussions master Synced 1mo ago

READMEChangelog (7)DependenciesVersions (8)Used By (0)

\##Use Navwalker de Wordpress with wordpress theme that have composer autoload

wp-bootstrap-navwalker
======================

[](#wp-bootstrap-navwalker)

**A custom WordPress nav walker class to fully implement the Bootstrap 4.0+ navigation style in a custom theme using the WordPress built in menu manager.**

[![Extras](https://camo.githubusercontent.com/cd1d8d28b948d535a361028251f489110e4d0f3f9503f9a2574710a9749b0824/687474703a2f2f6564776172646d63696e747972652e636f6d2f7075622f6769746875622f6e617677616c6b65722d332d6d656e752e6a7067)](https://camo.githubusercontent.com/cd1d8d28b948d535a361028251f489110e4d0f3f9503f9a2574710a9749b0824/687474703a2f2f6564776172646d63696e747972652e636f6d2f7075622f6769746875622f6e617677616c6b65722d332d6d656e752e6a7067)Bootstrap 4.0
------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

[](#bootstrap-40)

To can support Bootsprap 4 alpha you need to use the &gt;3 ver of this package

Installation
------------

[](#installation)

go to your theme folder with composer installed and autoloaded in functions.php

to import

```
composer require jorgelsaud/bootstrap-nav-walker

```

Open your WordPress themes **functions.php** file `/wp-content/your-theme/functions.php` and add the following code:

```
// Register Custom Navigation Walker
require_once('vendor/autoload.php');
```

add this to your functions file

```
add_filter('get_custom_logo','change_logo_class');

function change_logo_class($html)
{
    $html = str_replace('class="custom-logo"', 'img-fluid', $html);
    $html = str_replace('class="custom-logo-link"', 'navbar-brand', $html);
    return $html;
}
```

register your own menu adding this to functions.php

```
register_nav_menus( array(
    'primary' => __( 'Primary Menu', 'THEMENAME' ),
) );
```

Bootstrap 2.x vs Bootstrap 3.0
------------------------------

[](#bootstrap-2x-vs-bootstrap-30)

There are many changes Bootstrap 2.x &amp; Bootstrap 3.0 that affect both how the nav walker class is used and what the walker supports. For CSS changes I recommend reading the Migrating from 2.x to 3.0 in the official Bootstrap docs

The most noticeable functionality change in Bootstrap 3.0.0+ is that it only supports a single dropdown level. This script is intended to implement the Bootstrap 3.0 menu structure without adding additional features, so additional dropdown levels will not be supported.

If you would like to use **Bootstrap 2.x** you can find the legacy version of the walker class here

NOTE
----

[](#note)

This is a utility class that is intended to format your WordPress theme menu with the correct syntax and classes to utilize the Bootstrap dropdown navigation, and does not include the required Bootstrap JS files. You will have to include them manually.

Installation
------------

[](#installation-1)

go to your theme folder with composer installed and autoloaded in functions.php

to import

```
composer require jorgelsaud/bootstrap-nav-walker

```

Open your WordPress themes **functions.php** file `/wp-content/your-theme/functions.php` and add the following code:

```
// Register Custom Navigation Walker
require_once('vendor/autoload.php');
```

Usage
-----

[](#usage)

Update your `wp_nav_menu()` function in `header.php` to use the new walker by adding a "walker" item to the wp\_nav\_menu array.

```

```

Your menu will now be formatted with the correct syntax and classes to implement Bootstrap dropdown navigation.

You will also want to declare your new menu in your `functions.php` file.

```
register_nav_menus( array(
    'primary' => __( 'Primary Menu', 'THEMENAME' ),
) );
```

Typically the menu is wrapped with additional markup, here is an example of a ` navbar-fixed-top` menu that collapse for responsive navigation.

```

    &#9776;

```

To change your menu style add Bootstrap nav class names to the `menu_class` declaration.

Review options in the Bootstrap docs for more information on nav classes

Displaying the Menu
-------------------

[](#displaying-the-menu)

To display the menu you must associate your menu with your theme location. You can do this by selecting your theme location in the *Theme Locations* list wile editing a menu in the WordPress menu manager.

Extras
------

[](#extras)

[![Extras](https://camo.githubusercontent.com/cd1d8d28b948d535a361028251f489110e4d0f3f9503f9a2574710a9749b0824/687474703a2f2f6564776172646d63696e747972652e636f6d2f7075622f6769746875622f6e617677616c6b65722d332d6d656e752e6a7067)](https://camo.githubusercontent.com/cd1d8d28b948d535a361028251f489110e4d0f3f9503f9a2574710a9749b0824/687474703a2f2f6564776172646d63696e747972652e636f6d2f7075622f6769746875622f6e617677616c6b65722d332d6d656e752e6a7067)

This script included the ability to add Bootstrap dividers, dropdown headers, glyphicons and disables links to your menus through the WordPress menu UI.

Dividers
--------

[](#dividers)

Simply add a Link menu item with a **URL** of `#` and a **Link Text** or **Title Attribute** of `divider` (case-insensitive so ‘divider’ or ‘Divider’ will both work ) and the class will do the rest.

[![Divider Example](https://camo.githubusercontent.com/8e74c38a28dfda64717a335dd327348935d6f0958f4e39927914b9d08d28734e/687474703a2f2f6564776172646d63696e747972652e636f6d2f7075622f6769746875622f6e617677616c6b65722d646976696465722e6a7067)](https://camo.githubusercontent.com/8e74c38a28dfda64717a335dd327348935d6f0958f4e39927914b9d08d28734e/687474703a2f2f6564776172646d63696e747972652e636f6d2f7075622f6769746875622f6e617677616c6b65722d646976696465722e6a7067)

Glyphicons
----------

[](#glyphicons)

To add an Icon to your link simple place the Glyphicon class name in the links **Title Attribute** field and the class will do the rest. IE `glyphicon-bullhorn`

[![Header Example](https://camo.githubusercontent.com/6c44b40bbca7aedc62723059fa12929a62c3e32a99e9960eb99ba2d105793b31/687474703a2f2f6564776172646d63696e747972652e636f6d2f7075622f6769746875622f6e617677616c6b65722d332d676c79706869636f6e732e6a7067)](https://camo.githubusercontent.com/6c44b40bbca7aedc62723059fa12929a62c3e32a99e9960eb99ba2d105793b31/687474703a2f2f6564776172646d63696e747972652e636f6d2f7075622f6769746875622f6e617677616c6b65722d332d676c79706869636f6e732e6a7067)

Dropdown Headers
----------------

[](#dropdown-headers)

Adding a dropdown header is very similar, add a new link with a **URL** of `#` and a **Title Attribute** of `dropdown-header` (it matches the Bootstrap CSS class so it's easy to remember). set the **Navigation Label** to your header text and the class will do the rest.

[![Header Example](https://camo.githubusercontent.com/fe33507c954e932377bf73ed25726224d6012ccdd4e33dc190f64ff9d5a96375/687474703a2f2f6564776172646d63696e747972652e636f6d2f7075622f6769746875622f6e617677616c6b65722d332d6865616465722e6a7067)](https://camo.githubusercontent.com/fe33507c954e932377bf73ed25726224d6012ccdd4e33dc190f64ff9d5a96375/687474703a2f2f6564776172646d63696e747972652e636f6d2f7075622f6769746875622f6e617677616c6b65722d332d6865616465722e6a7067)

Disabled Links
--------------

[](#disabled-links)

To set a disabled link simply set the **Title Attribute** to `disabled` and the class will do the rest.

[![Header Example](https://camo.githubusercontent.com/9fa69db2ce3147b0310cdf78e2a69d649a34bae065254bf1f7152866a6429037/687474703a2f2f6564776172646d63696e747972652e636f6d2f7075622f6769746875622f6e617677616c6b65722d332d64697361626c65642e6a7067)](https://camo.githubusercontent.com/9fa69db2ce3147b0310cdf78e2a69d649a34bae065254bf1f7152866a6429037/687474703a2f2f6564776172646d63696e747972652e636f6d2f7075622f6769746875622f6e617677616c6b65722d332d64697361626c65642e6a7067)

Only Icons
----------

[](#only-icons)

To set icon of Font awesome only linksimply set the **Title Attribute** to `only-icon` and the class will do the rest.

[![Header Example](https://camo.githubusercontent.com/9fa69db2ce3147b0310cdf78e2a69d649a34bae065254bf1f7152866a6429037/687474703a2f2f6564776172646d63696e747972652e636f6d2f7075622f6769746875622f6e617677616c6b65722d332d64697361626c65642e6a7067)](https://camo.githubusercontent.com/9fa69db2ce3147b0310cdf78e2a69d649a34bae065254bf1f7152866a6429037/687474703a2f2f6564776172646d63696e747972652e636f6d2f7075622f6769746875622f6e617677616c6b65722d332d64697361626c65642e6a7067)

Changelog
---------

[](#changelog)

**3.0**Support For Work With Bootstrap 4 **2.4**compatible with bt4 **2.3**Resolved Issue with attr not defined **2.2**Add class to only icon (icononly) **2.1**Added only icon feature

Previous this changes
---------------------

[](#previous-this-changes)

**2.0.4**

- Updated fallback function to accept args array from wp\_nav\_menu

**2.0.3**

- Included a fallback function that adds a link to the WordPress menu manager if no menu has been assigned to the theme location.

**2.0.2**

- Small tweak to ensure carets are only displayed on top level dropdowns.

**2.0.1**

- Added missing `active` class to active menu items.

**2.0**

- Class was completly re-written using the latest Wordpress 3.6 walker class.
- Now full supports Bootstrap 3.0+
- Tested with wp\_debug &amp; the Theme Check plugin.

[![Bitdeli Badge](https://camo.githubusercontent.com/60645673c055965633068f43e73f7489fddc3ce3cba0798308881783f57877c2/68747470733a2f2f64327765637a68766c38323376302e636c6f756466726f6e742e6e65742f7477697474656d2f77702d626f6f7473747261702d6e617677616c6b65722f7472656e642e706e67)](https://bitdeli.com/free "Bitdeli Badge")

###  Health Score

31

—

LowBetter than 68% of packages

Maintenance15

Infrequent updates — may be unmaintained

Popularity19

Limited adoption so far

Community8

Small or concentrated contributor base

Maturity68

Established project with proven stability

 Bus Factor1

Top contributor holds 100% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

###  Release Activity

Cadence

Every ~9 days

Total

7

Last Release

3594d ago

Major Versions

v1.0 → v2.12016-05-09

### Community

Maintainers

![](https://www.gravatar.com/avatar/1ea0268ff3bee56334c410e2f82a79215870af35a5d458366539dda73881ee70?d=identicon)[giorgiosaud](/maintainers/giorgiosaud)

---

Top Contributors

[![Giorgiosaud](https://avatars.githubusercontent.com/u/38225960?v=4)](https://github.com/Giorgiosaud "Giorgiosaud (26 commits)")

### Embed Badge

![Health badge](/badges/jorgelsaud-bootstrap-nav-walker/health.svg)

```
[![Health](https://phpackages.com/badges/jorgelsaud-bootstrap-nav-walker/health.svg)](https://phpackages.com/packages/jorgelsaud-bootstrap-nav-walker)
```

###  Alternatives

[vrkansagara/lara-out-press

This is simply compress your final out of Laravel Application and serve to the browser.

6725.7k](/packages/vrkansagara-lara-out-press)

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)
