You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
A custom WordPress nav walker class to fully implement the Bootstrap 3.0+ navigation style in a custom theme using the WordPress built in menu manager.
11
+
A custom WordPress nav walker class to fully implement the Bootstrap 3.0+ navigation style in a custom theme using the WordPress built in menu manager. A working version of the walker for Bootstrap 4.0.0 can be found in the [`v4` branch](https://github.com/wp-bootstrap/wp-bootstrap-navwalker/tree/v4)
12
12
13
13
## NOTES
14
14
15
-
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.
15
+
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. It does not include the required Bootstrap JS and CSS files. You will have to include those dependancies separately.
16
16
17
17
### Bootstrap 4
18
18
19
-
Bootstrap 4 beta is available and is now the default branch offered at the GitHub repo and on [GetBootstrap](https://getbootstrap.com). A working version of the walker for Bootstrap 4 can be found in the `v4` branch.
20
-
21
-
Acording to @mdo & team:
22
-
23
-
> Long story short, shipping a beta means we’re done breaking all your stuff until our next major version (v5).
19
+
Bootstrap 4.0.0 released January 2018 and is the default branch offered at the GitHub repo and on [GetBootstrap](https://getbootstrap.com).
24
20
25
21
## Installation
26
22
@@ -29,19 +25,21 @@ Place **wp-bootstrap-navwalker.php** in your WordPress theme folder `/wp-content
29
25
Open your WordPress themes **functions.php** file `/wp-content/your-theme/functions.php` and add the following code:
If you encounter errors with the above code use a check like this to return clean errors to help diagnose the problem.
37
34
38
35
```php
36
+
<?php
39
37
if ( ! file_exists( get_template_directory() . '/wp-bootstrap-navwalker.php' ) ) {
40
38
// file does not exist... return an error.
41
39
return new WP_Error( 'wp-bootstrap-navwalker-missing', __( 'It appears the wp-bootstrap-navwalker.php file may be missing.', 'wp-bootstrap-navwalker' ) );
@@ -117,13 +112,14 @@ Review options in the Bootstrap docs for more information on [nav classes](https
117
112
118
113
### Displaying the Menu
119
114
120
-
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.
115
+
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 while editing a menu in the WordPress menu manager.
121
116
122
117
### Making this Walker the Default Walker for Nav Manus
123
118
124
119
There has been some interest in making this walker the default walker for all menus. That could result in some unexpected situations but it can be achieved by adding this function to your functions.php file.
125
120
126
121
```php
122
+
<?php
127
123
function prefix_modify_nav_menu_args( $args ) {
128
124
return array_merge( $args, array(
129
125
'walker' => WP_Bootstrap_Navwalker(),
@@ -135,24 +131,24 @@ Simply updating the walker may not be enough to get menus working right, you may
135
131
136
132
### Extras
137
133
138
-
This script included the ability to add Bootstrap dividers, dropdown headers, glyphicons and disables links to your menus through the WordPress menu UI.
134
+
This script included the ability to add Bootstrap dividers, dropdown headers, glyphicons and disabled links to your menus through the WordPress menu UI.
139
135
140
-
### Dividers
136
+
####Dividers
141
137
142
138
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.
143
139
144
-
### Glyphicons
140
+
####Glyphicons
145
141
146
142
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`
147
143
148
-
### Dropdown Headers
144
+
####Dropdown Headers
149
145
150
146
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.
151
147
152
-
### Disabled Links
148
+
####Disabled Links
153
149
154
150
To set a disabled link simply set the **Title Attribute** to `disabled` and the class will do the rest.
155
151
156
-
###Changelog
152
+
## Changelog
157
153
158
154
Please see the [Changelog](https://github.com/wp-bootstrap/wp-bootstrap-navwalker/blob/master/CHANGELOG.md).
0 commit comments