Dropdown Menu not displaying correctly

Can anybody help me with this, please?

I really need some help on this. I’m have wracked my brain on trying to figure out why it’s not working for me. ??

First off, these are entirely volunteer-driven forums, many of whom have day jobs and other responsibilities. In the future, if your needs are truly so urgent, you may be better off hiring someone at https://jobs.wordpress.net/

What theme are you using? Can you post a link to a page that shows the issue?

I understand that. I posted two more times because after only 10 minutes my post was pushed to the second page and I didn’t want it to get buried where no one would ever even see it.

I currently have the website on my localhost so I cannot provide a link to a demo of it. The theme I am using is custom built by me.

I used https://www.underscores.me to provide me with a basic default theme to then customize.

I’m actually surprised you’re having to do this; Underscores comes with a built-in dropdown menu. Did you change any of the classes or IDs around the call to wp_nav_menu()?

Check out this fiddle: https://jsfiddle.net/x5dgqsmk/. If you hover over the third link labeled “First” (confusing, huh?), you’ll see a dropdown menu with a yellow background. That should be enough to at least get you started.

Very interesting. I must have changed something. Thanks for letting me know it does come with it by default though. I’ll take a look through what I changed in the menu and see if I accidentally changed something that I shouldn’t have.

As far as I can tell, the only thing I “changed” with the menu was I added a couple more items to it through a function. Could this be what’s causing the conflict?

function add_last_nav_item($items) {
  return $items .= '<li class="social-link"><a href="https://www.facebook.com/ColumbiaREDI" target="_blank"><i class="fa fa-facebook"></i></a></li>
  		    <li class="social-link"><a href="https://twitter.com/columbiaredi" target="_blank"><i class="fa fa-twitter"></i></a></li>
	            <li id="sb-search" class="sb-search">
	              <form name="search-form" role="search" method="get" id="searchform" class="searchform" action="/">
	                <input class="sb-search-input" placeholder="Enter your search term..." type="text" value="" name="s" id="s" />
	        	<button type="submit" form="searchform" formmethod="get" ><i class="fa fa-search"></i></button>
	               </form>
	             </li>';
}
add_filter('wp_nav_menu_items','add_last_nav_item');

I also have this php in my header to call the wordpress menu.

<?php wp_nav_menu( array( 'theme_location' => 'primary', 'menu_id' => 'primary-menu', 'menu_class' => 'nav navbar-nav' ) ); ?>

I am having the same problem. I changed the menu step by step, it shows correctly in dashboard, but none of the changes are showing on the menu. Which means all the new pages cannot be found. Any clues would be appreciated. This is my second day of trouble shooting with no solution.

@flanamac: Please create your own thread to discuss your issue.

@theausting: I noticed you’ve got some Bootstrap classes in your call to wp_nav_menu(); Bootstrap requires a bit more setup if you’d like to use their menus in WordPress.

Have you changed any of the HTML surrounding the call to wp_nav_menu()? By default, Underscores looks for the class “main-navigation” in order to apply the appropriate styling to the menu. Check out lines 523-609 to see how Underscores has their menu styling set up.

I added the class “main-navigation” to the menu and the dropdowns do work now. They styling is completely off but I do believe I can fix that pretty easily.

Thank you a lot for your help!