When using PUPHET vagrant machines running on VirtualBox, there’s a problem when one tries to run a multiple, simultaneous vagrant installs right out of the box:

Vagrant cannot forward the specified ports on this VM, since they would collide with some other application that is already listening on these ports. The forwarded port to 2222 is already in use on the host machine.
To fix this, modify your current projects Vagrantfile to use another port. Example, where '1234' would be replaced by a unique host port:
  config.vm.network :forwarded_port, guest: 22, host: 1234
Sometimes, Vagrant will attempt to auto-correct this for you. In this case, Vagrant was unable to. This is usually because the guest machine is in a state which doesn't allow modifying port forwarding.

Despite what this message says, you can fix the problem by running the command:

vagrant reload
...
==> default: Clearing any previously set forwarded ports...
==> default: Fixed port collision for 22 => 2222. Now on port 10200.
...

This command reconfigures a new SSH Host Port, which fixes the conflict.   This can be verified in VirtualBox | Settings | Network | Port Forwarding.  This worked on the following system: Max OSX, Vagrant V1.7.2

When I design websites and develop custom themes for WordPress, I like to use Twitter Bootstrap as my CSS framework.  I combine the _s theme from the developers at WordPress with Bootstrap. That’s a whole other blog post.  The combination of the starter theme and the CSS framework as a starting point results in an efficient web design workflow.

It’s would be nice to be able to use the standard WordPress menu output from wp_nav_menu() in my header.  Here’s a bit of JavaScript that adds the Bootstrap CSS to WordPress menus:

(function ($) {
'use strict';

// make wp_nav_menu compatible with bootstrap dropdowns
$( “li.menu-item-has-children” ).addClass( “dropdown” );
$( “li.menu-item-has-children > a”).addClass( “dropdown-toggle” );
$( “li.menu-item-has-children > a”).attr(‘data-toggle’, ‘dropdown’);
$( “ul.sub-menu” ).addClass( “dropdown-menu” );
$( “ul.sub-menu” ).addClass( “dropdown-menu-left” );

})(jQuery);

Often when a page loads, Bootstrap sub-menus will flash on screen until the code catches up and hides them. To fix this annoying flash of dropdown menus, use the following CSS:

.sub-menu { display: none; }

That’s all you need to use WordPress menus with Twitter Bootstrap.