My Bootstrap Menu

Description

My Boostrap Menu is a fully customizable plugin that applies the Bootstrap formatting classes to any WordPress Navigation Menu. Bootstrap provides responsive menus for phones, tablets and desktops.

The plugin allows the user to select a menu by name, or by selecting your theme’s menu location. This gives extreme flexibility for theme developers, allowing multiple menus to be formatted as bootstrap menus- e.g. one fixed at the top and another at the bottom of the screen!

Works with all levels of Sub-menus! These were removed from Bootstrap in version 3, however we have included the original styles and each level will be correctly styled.

‘My Boostrap Menu’ is built on the ‘My Plugin Settings’ framework which creates simple and intuitive user interfaces for input forms; including media dialogues and the popup selection of Bootstrap Glyphicons.

More information here: My Bootstrap Menu

Features

Fully customizable labels, logos, icons, formatting and alignment make this the most user and developer friendly menu tool. Additional styles have been included to tweak basic formatting issues when using Bootstrap navbars with WordPress. Each Menu can be Bootstrapped and configured with settings:

Choose your menu type

  • Navbar
  • Tabs
  • Pills
  • Buttons
  • Button Group

Select a menu location

  • Fixed to the top of the screen
  • Fixed to the bottom
  • Static Top

Choose to display:

  • Title
  • Logo
  • Login, Register
  • Search

Upload a custom Logo

  • Optional logo for the Mobile version

Custom Search box

  • Select a Glyhpicon, button type and labels
  • Choose default text for the search input box

Custom Login and Register buttons

  • Select Glyphicons and label text

Formatting

  • Align any/all menu elements left or right!
  • Customize the button menu style
  • Customize Sub-menu dropdowns and links
    Advanced Options!
  • Optional container classes
  • Include WordPress default classes or not
  • Optional fixes for fixed top menus
    All files included
  • Select whether to load the included versions of Boostrap and custom css.

About us

This plugin has been developed by Michael Carder Ltd. It is is built on the ‘My Plugin Settings’ framework which creates simple and intuitive user interfaces for input forms; including media dialogues and the popup selection of Bootstrap Glyphicons.

‘Contact us’ for more information.

Screenshots

  • The main settings page, showing the list of menus and the main tabs
  • A standard Bootstrap Nav Menu, with logo and multi-tiered sub-menus
  • Inverse Pills menu
  • Button Menu aligned right, and different glyphicons for search and logout
  • Mobile enabled responsive menu, features vertical button stacking.
  • Glyphicon Selection for Search, Login, Logout, and Register buttons
  • Select a logo to display on your menu

Installation

Requires PHP 5.3+

My Bootstrap Menu can be installed in a few easy steps:

Either:

  1. Search for the ‘My Bootstrap Menu’ plugin via WordPress Admin > Plugins > Add New
  2. Install with the ‘Install Now’ button

Or:

  1. Unzip “My Bootstrap Menu” and put all files into a folder like “/wp-content/plugins/my-bootstrap-menu/”
  2. Activate the plugin through the ‘Plugins’ menu in WordPress

Then…

  1. Inside WordPress admin, go to Appearance > My Bootstrap Menu
  2. Select which menu or location to Bootstrap and select the checkbox: ‘Bootstrap this menu’
  3. Configure any other settings
  4. Save and go to your site to see your new Menu!

FAQ

Installation Instructions

Requires PHP 5.3+

My Bootstrap Menu can be installed in a few easy steps:

Either:

  1. Search for the ‘My Bootstrap Menu’ plugin via WordPress Admin > Plugins > Add New
  2. Install with the ‘Install Now’ button

Or:

  1. Unzip “My Bootstrap Menu” and put all files into a folder like “/wp-content/plugins/my-bootstrap-menu/”
  2. Activate the plugin through the ‘Plugins’ menu in WordPress

Then…

  1. Inside WordPress admin, go to Appearance > My Bootstrap Menu
  2. Select which menu or location to Bootstrap and select the checkbox: ‘Bootstrap this menu’
  3. Configure any other settings
  4. Save and go to your site to see your new Menu!
Where can I find the settings for each menu?

All settings are managed in Wordpres Admin > Appearance > My Bootstrap Menu

Why isn’t my menu being bootstrapped?

There are a couple of things to make sure of:
1. The checkbox ‘Bootstrap this menu’ is checked
2. The settings are saved
3. You are either loading the plugin’s version of Bootstrap, or you have one loaded with your theme
4. The menu is being called by name correctly
5. The theme location is being called correctly in your theme files

Does this plugin work with newest WP version

Yes, this plugin works fine with WordPress 4.2.2

Reviews

GREAT! AWESOME 6 Stars!

This plugin gave me EXACTLY what I wanted. Am using the Understrap Theme with the Elementor.com plugin-This is The ONLY plugin to use. I searched all week, trying different themes and combinations. Thanks for your excellent work!

No reviews, but works great!

This plugin should have more reviews and ratings!

Seems to work great at automatically converting your menu to have a bootstrap layout with all the right classes. There’s all the default bootstrap options available like making the colors inverse (dark vs light), making it container or container-fluid, etc. It also lets you choose if you want to load the plugins css/jquery or use what’s already in your template. Very nice.

There is a small visual bug if you having multiple menu locations – the dropdown may display the incorrect one. Just check the options page title or the browser url to make sure you are on the right one.

NOTE THIS PLUGIN DOES NOT LET YOU CHANGE COLORS OR STYLE YOUR MENU. This is meant for people who already know how to work with bootstrap and CSS and just want to make their life easier converting their menu to the bootstrap classes 🙂

Thanks codetoolbox! Looks great so far.

Fantastic Add on – however I have a query?

Hello

I love the add on and makes the responsive bootstrap menu easy to add to my theme. However how do I edit the CSS of the menu once it has been created.

I would like to edit the colour, format etc of the sub menu, and also remove the div that appears at the top of the navigation a div roughly sized 25px.

It would be great to be able to do this and also change the width of the drop downs that I can create as wordy nav items overflow out of their box

Easy setup with customisation

It works fine just as described! Thanks! it’s a shame to see why it has 2 1 stars… they do not reflect the quality of this FREE plugin.

Keep up the good work.

Read all 9 reviews

Contributors & Developers

“My Bootstrap Menu” is open source software. The following people have contributed to this plugin.

Contributors

Translate “My Bootstrap Menu” into your language.

Interested in development?

Browse the code, check out the SVN repository, or subscribe to the development log by RSS.

Changelog

1.2.1

Update to allow ‘None’ for internal container type.
Also various formatting updates.

1.2.0

POTENTIALLY BREAKING CHANGES
Changed saved menu name to be slug format. You may need to reapply settings/logos etc.
Added Logo ‘title’ and ‘alt’ text fields.
Fix for selecting a Menu/Theme from drop-down.

1.1.2

Fix for uninstalling/deleting the plugin.

1.1.1

Minor fix for Admin site for Firefox

1.1.0

First major revision – ALWAYS CHECK BEFORE UPGRADING LIVE SITES
Updated and checked for WordPress 4.4
Updated Internal Bootstrap version to 3.3.6.
Changed dropdown menu icons to use Glyphicons (i.e. use with Bootstrap)
Changed search field classes – improved appearance on mobile mode.
Removed on-hover sub-menu styles… this is to keep consistent with Bootstrap being mobile/tablet friendly.
Fixed submenu headings are links – requires clicking the caret for submenus.
Fixed Tab, Button, Button Group Menus to show active correctly.
Fixes for the Pills, Buttons, Button Group and Tabs with submenus on collapse.
Reduced margins on Tabs to show at the bottom of the navbar.
Removed duplicate class declaration on menu types.
Displays either 1) caret (or glyphicon) for top level menu and 2) right caret for submenus.
Fixes for php versions <5.3
My-Plugin-Settings-Helper – updated

1.0.6

Fix to use caret, instead of WP dashicons by default. Load Dashicons if selected.

1.0.5

Fixes for php versions <5.4.
Possible fix for object instead of string for unique id.
Added ability to select Dashicon for dropdown menu items.

1.0.4

Added ‘active’ class to all parent menu and submenu items.

1.0.3

Fixes for WordPress 4.3.0 compatibility. Menu names being returned as menu objects in the latest WP release.

1.0.2

Enhanced functionality for setting Main Menu Items as links when they have child/submenu items.
This will change the behaviour when selecting ‘Submenu headings are links’ so that submenus appear on mouse-over and menu items open on click.
(Thanks to David Woodward for highlighting this)

1.0.1

Minor fixes for unique menu id, to remove non alpha-numeric characters.

1.0

First release!