Solved

Issue with top navigation for WP 4.0

Posted on 2014-09-11
37
170 Views
Last Modified: 2014-09-27
Hello, our site is having an issue with our top navigation after upgrading to WP 4.0. For some reason our quick links navigation is our top navigation (primary). Something in the upgrade to 4.0 broke our top navigation so I was curious where in the code i might check to fix this issue.

Here is what our production enviroment looks like with the 4.0 upgrade - http://supercon2k.com

Here is what our dev looks like without the 4.0 upgrade - http://dev.supercon2k.com/ (Correctly working)
0
Comment
Question by:DancingFighterG
  • 22
  • 14
37 Comments
 

Author Comment

by:DancingFighterG
ID: 40319967
Is there anyone that can give me some help with this?
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 40319987
Anything with that much scripting coming from multiple source is guaranteed to fail at some point because of obsolete code, incompatibilities, or conflicts.  That holds especially true when the markup is invalid and contains obsolete attributes, and structural errors, that should have been fixed before you tried to upgrade.

I would first check to make sure you have the latest version of all the scripts.  Then remove the scripts one at a time until the nav starts working again, and you will have found the culprit.

Cd&
0
 
LVL 15

Expert Comment

by:eemit
ID: 40320102
Take a look in your header.php in your theme's folder if call to function wp_nav_menu() exists

Not sure but I think it should look like this:
<?php wp_nav_menu( array( 'theme_location' => 'top-navigation', 'menu_class' => 'menu' ) ); ?>

But to make any changes to your theme you must create a child theme to avoid that your changes will be overwritten when the parent theme updates.
Copy header.php from the parent theme into your child theme's folder and make the changes there.

- Why this happens after upgrading to WP 4.0?
Compare these two snpets bellow:

new WP 4.0:
$menus = wp_get_nav_menus( array( 'orderby' => 'name' ) );
old:
$menus = wp_get_nav_menus();

You have maybe not supplied theme_location in wp_nav_menu call, therefore first menu ordered by name is taken:
"quick-links" and not "top-navigation".
- - -

new WP 4.0:
function wp_nav_menu( $args = array() ) {

	// get the first menu that has items if we still can't find a menu
	if ( ! $menu && !$args->theme_location ) {
		$menus = wp_get_nav_menus( array( 'orderby' => 'name' ) );
		foreach ( $menus as $menu_maybe ) {
			if ( $menu_items = wp_get_nav_menu_items( $menu_maybe->term_id, array( 'update_post_term_cache' => false ) ) ) {
				$menu = $menu_maybe;
				break;
			}
		}
	}

Open in new window

old:
function wp_nav_menu( $args = array() ) {

	// get the first menu that has items if we still can't find a menu
	if ( ! $menu && !$args->theme_location ) {
		$menus = wp_get_nav_menus();
		foreach ( $menus as $menu_maybe ) {
			if ( $menu_items = wp_get_nav_menu_items( $menu_maybe->term_id, array( 'update_post_term_cache' => false ) ) ) {
				$menu = $menu_maybe;
				break;
			}
		}
	}

Open in new window


You should also have call to function register_nav_menus() in callback function of the 'after_setup_theme' action hook e.g.:

// This theme uses wp_nav_menu() in two locations.
register_nav_menus( array(
	'top-navigation'   => __( 'Top primary menu', 'yourthemestextdomain' ),
	'quick-links' => __( 'Secondary menu in right sidebar', 'yourthemestextdomain' ),
) );

Open in new window

0
 

Author Comment

by:DancingFighterG
ID: 40323638
Hello Emitt,

Couple of questions:

Where is the following function located at:

function wp_nav_menu( $args = array() ) {

Is this in the header file?

I made the change you suggested and the navigation is not correct. Take a look at http://dev.supercon2k.com

Here is what the original code looks like:

<?php wp_nav_menu(array('menu' => 'Site Navigation', 'container_class' => 'site-navigation')); ?>

Also where is the location for the register_nav_menus located at?

I've uploaded the entire header.php file. In production I fix this issue by changing the naming of the navigation so that the top navigation shows up by in order by name first. The issue I have now is that the side menu is showing all the options for both navigations
code.docx
0
 
LVL 15

Expert Comment

by:eemit
ID: 40324327
>Where is the following function located at:
>function wp_nav_menu( $args = array() ) {
>Is this in the header file?

No, this was code from WordPress Core, only as ilustration.
wp_nav_menu() is located in wp-includes/nav-menu-template.php.

>Also where is the location for the register_nav_menus located at?

You should find call to this function in your parent theme's functions.php
Post here function in which call to register_nav_menus resides.

What happens if you try this in your header.php in child theme's folder of dev environment?
<?php wp_nav_menu( array( 'theme_location' => 'top-navigation', 'menu' => 'Site Navigation', 'container_class' => 'site-navigation')); ?>
0
 

Author Comment

by:DancingFighterG
ID: 40325956
I get an error on the page when I use the following code:

<?php wp_nav_menu( array( 'theme_location' => 'top-navigation', 'menu' => 'Site Navigation', 'container_class' => 'site-navigation')); ?>

Take a look dev.supercon2k.com

Do I need to make any changes to the function your described from the beginning? Also, in terms of the theme the theme was custom to me but with some new developers coming on board I'm going to have them work within the child theme now so we don't mess up the root of the main theme
0
 
LVL 15

Expert Comment

by:eemit
ID: 40326492
- Did you replace this:
<?php wp_nav_menu(array('menu' => 'Site Navigation', 'container_class' => 'site-navigation')); ?>
with this:
<?php wp_nav_menu( array( 'theme_location' => 'top-navigation', 'menu' => 'Site Navigation', 'container_class' => 'site-navigation')); ?>

- Is slug of your Top Mneu 'top-navigation' ?

- You didn't answer my question about register_nav_menus!
Exists register_nav_menus() call in your parent's theme functions.php
and and how it looks?

You need two things:
register_nav_menus() in your functions.php file to register the menus and
wp_nav_menu() in your header.php or in your sidebar.php ... where you want the menus to show up

To be able to help we need more information.
Post slug of both menus and also wp_nav_menu() call for your menu in sidebar.
0
 

Author Comment

by:DancingFighterG
ID: 40327224
Hello Emmit,

I've attached all the files you have requested. The weird thing is that the developer we had did not use a child theme so I setup a child theme folder called SuperCon2KChild
functions.php
sidebar.php
header.php
0
 

Author Comment

by:DancingFighterG
ID: 40327226
The two slugs are:

Quick Links
Top Navigation
0
 
LVL 15

Expert Comment

by:eemit
ID: 40327620
Do I need to make any changes to the function your described from the beginning?
No, remove all previous changes and make the following:

1)
Add this to your child theme's functions.php
add_action( 'after_setup_theme', 'twentytenchild_setup', 11 );
function twentytenchild_setup() {

	//Unregisters a custom navigation menu for a theme location.
	unregister_nav_menu( 'primary' );

	// This theme uses wp_nav_menu() in two locations.
	register_nav_menus( array(
		'top-navigation'   => __( 'Top Navigation', 'twentyten' ),
		'quick-links' => __( 'Quick Links', 'twentyten' ),
	) );

}

Open in new window

2)
Make a copy of your sidebar.php into your child theme's folder, if it's not already done, and edit it as the following:
Replace this line:
'theme_location'  => '',

Open in new window

With this line:
'theme_location'  => 'quick-links',

Open in new window


3)
Make a copy of your header.php into your child theme's folder, if it's not already done, and edit it as the following:
Replace this:
wp_nav_menu( array('menu' => 'Site Navigation', 'container_class' => 'site-navigation'));

Open in new window

with this:
wp_nav_menu( array('menu' => 'Site Navigation', 'container_class' => 'site-navigation', 'theme_location' => 'top-navigation' ) );

Open in new window


4)
In Appearance/Menus Screen in Tab Manage Locations select which menu appears in each location.
0
 

Author Comment

by:DancingFighterG
ID: 40335308
Hello, I made the changes and if fixed the quick links nav but the top nav is still not showing up properly
0
 
LVL 15

Expert Comment

by:eemit
ID: 40335367
Compare your header.php files in child themes of:
http://supercon2k.com and http://dev.supercon2k.com/

if you can post here code, but only from:
<body <?php body_class(); ?>>
to:
<h1 id="site-title">
from both header.php files
0
 

Author Comment

by:DancingFighterG
ID: 40335712
Here is the code the dev header file;:

<body <?php body_class(); ?>>

		<div class="gridnav">
			
		<div class="container_24">
			
		<div class="grid_24" id="access">
		
    		<?php wp_nav_menu( array('menu' => 'Site Navigation', 'container_class' => 'site-navigation', 'theme_location' => 'top-navigation' ) ); ?><div class="clear"></div>
    		
    		</div><div class="clear"></div>

		</div>

		</div>

		<div class="container_24">
	
		
		<div class="grid_12 alpha omega" style="min-height: 380px;">
			

		<h1 id="site-title">

Open in new window


Here is the header code for production:

<body <?php body_class(); ?>>

		<div class="gridnav">
			
		<div class="container_24">
			
		<div class="grid_24" id="access">
		
    		<?php wp_nav_menu( array('menu' => 'Site Navigation', 'container_class' => 'site-navigation')); ?><div class="clear"></div>
    		
    		</div><div class="clear"></div>

		</div>

		</div>

		<div class="container_24">
	
		
		<div class="grid_12 alpha omega" style="min-height: 380px;">
			

		<h1 id="site-title">

Open in new window

0
 
LVL 15

Expert Comment

by:eemit
ID: 40335923
- It is strange that you have:
<div class="menu"><ul>
It should be:
<div class="site-navigation"><ul id="menu-top-navigation" class="menu">

- Try to Clear Your Browser's Cache.

- Are you sure that child theme is active?
0
 

Author Comment

by:DancingFighterG
ID: 40335956
Where are you seeing the following line:

<div class="menu"><ul>

Open in new window


I don't see that line in the header code for dev.  The child theme is active. I've also cleared the cache
0
 
LVL 15

Expert Comment

by:eemit
ID: 40336264
You see it if you view page source code in a web browser.

Is header.php file in your child theme's folder?
0
 

Author Comment

by:DancingFighterG
ID: 40338244
Yes, the header.php is in the child folder
0
 
LVL 15

Expert Comment

by:eemit
ID: 40341596
It looks like that your top menu slug is 'top-navigation', not 'site-navigation'.

But still (assuming your menu name is 'Site Navigation') with this:
<?php wp_nav_menu( array('menu' => 'Site Navigation', 'container_class' => 'site-navigation', 'theme_location' => 'top-navigation' ) ); ?>

You must get this output:
<div class="site-navigation"><ul id="menu-top-navigation" class="menu">

Exactly how you get it already on production site.

Exceptionally, try the following (on your dev site):
- Make backup of your parent theme first.
- To be sure, make changes also in header.php of your parent theme.
0
Highfive Gives IT Their Time Back

Highfive is so simple that setting up every meeting room takes just minutes and every employee will be able to start or join a call from any room with ease. Never be called into a meeting just to get it started again. This is how video conferencing should work!

 

Author Comment

by:DancingFighterG
ID: 40347800
In production I changed the menu for the quick links to Zuick Links so that by default it is looking at the top-navigation menu as the primary. But you can see in production the quick links section is showing all navigation items and not just the quick link items
0
 
LVL 15

Expert Comment

by:eemit
ID: 40347847
- Have you this line in Header of your child theme's style.css on dev site?
Template: supercon2k

- Can you please activate your parent theme (supercon2k) on your dev site?
0
 

Author Comment

by:DancingFighterG
ID: 40347853
Hold on. Let me check and I will activate the parent theme as well
0
 

Author Comment

by:DancingFighterG
ID: 40347855
Yes, the line

Template: supercon2k

is in the child css.

I activate the parent theme for you
0
 

Author Comment

by:DancingFighterG
ID: 40347860
I had to change the code back to the original theme code that is in production so you can see it properly. Now the navigation shows up but its back to the original issue that was in dev and production.

Right now the top navigation is the menu items for the quick links
0
 

Author Comment

by:DancingFighterG
ID: 40347913
I think the issue is that with the upgrade is only seeing one menu under site-navigation but it needs to see both both the top-navigation menu and the quick-links menu
0
 
LVL 15

Accepted Solution

by:
eemit earned 500 total points
ID: 40347947
Change this in your header.php of your child theme on dev site:
<?php wp_nav_menu( array('menu' => 'Site Navigation', 'container_class' => 'site-navigation', 'theme_location' => 'top-navigation' ) ); ?>
To:
<?php wp_nav_menu( array('menu' => 'Top Navigation', 'container_class' => 'site-navigation', 'theme_location' => 'top-navigation' ) ); ?>

And activate your child theme again.
0
 

Author Comment

by:DancingFighterG
ID: 40347954
That fixed it. Going to apply this fix to production. Your the greatest. I'm actually looking for some contractor to add some additional functionality to my site. Are you or anyone else interested. Do I need to make a separate post for that?
0
 
LVL 15

Expert Comment

by:eemit
ID: 40347963
Yes I am Interested. In my profile there is a button "Hire me".
0
 

Author Comment

by:DancingFighterG
ID: 40347967
Is your rate customized or do you have a set rate?
0
 

Author Comment

by:DancingFighterG
ID: 40347972
Quick issue that I am having with prod. I applied all the code but the following code out of the function.php file keeps showing up on the site:

add_action( 'after_setup_theme', 'twentytenchild_setup', 11 ); function twentytenchild_setup() { //Unregisters a custom navigation menu for a theme location. unregister_nav_menu( 'primary' ); // This theme uses wp_nav_menu() in two locations. register_nav_menus( array( 'top-navigation' => __( 'Top Navigation', 'twentyten' ), 'quick-links' => __( 'Quick Links', 'twentyten' ), ) ); }

Do you know why?
0
 
LVL 15

Expert Comment

by:eemit
ID: 40347980
Check if you have added this code to you header.php file, it should be in your functions,php file!
0
 
LVL 15

Expert Comment

by:eemit
ID: 40347985
>Is your rate customized or do you have a set rate?
No problem, expert exchange members have always discount ;-)
0
 

Author Comment

by:DancingFighterG
ID: 40347987
I don't see it in the header file for the child or the parent so this is weird
0
 

Author Comment

by:DancingFighterG
ID: 40347994
I'm getting this error:

add_action( 'after_setup_theme', 'twentytenchild_setup', 11 ); function twentytenchild_setup() { //Unregisters a custom navigation menu for a theme location. unregister_nav_menu( 'primary' ); // This theme uses wp_nav_menu() in two locations. register_nav_menus( array( 'top-navigation' => __( 'Top Navigation', 'twentyten' ), 'quick-links' => __( 'Quick Links', 'twentyten' ), ) ); }
Warning: Cannot modify header information - headers already sent by (output started at /home/supercon/public_html/wp/wp-content/themes/supercon2kchild/functions.php:11) in /home/supercon/public_html/wp/wp-includes/pluggable.php on line 1173
0
 

Author Comment

by:DancingFighterG
ID: 40348000
Ok, I delete the content out of the function.php file for the child theme and now the issue went away. I don't know why taking away the code in the function.php fixes this issue. I wonder if the following code:

add_action( 'after_setup_theme', 'twentytenchild_setup', 11 );
function twentytenchild_setup() {

	//Unregisters a custom navigation menu for a theme location.
	unregister_nav_menu( 'primary' );

	// This theme uses wp_nav_menu() in two locations.
	register_nav_menus( array(
		'top-navigation'   => __( 'Top Navigation', 'twentyten' ),
		'quick-links' => __( 'Quick Links', 'twentyten' ),
	) );

}

Open in new window


Is being used somewhere else. Looking now
0
 
LVL 15

Expert Comment

by:eemit
ID: 40348004
Insert this code at the end of your functions.php file or at least after first
 <?php and before last ?>.
0
 

Author Comment

by:DancingFighterG
ID: 40348018
I just noticed the missing open and closed. Thanks bud!! I will be contacting you soon
0
 

Author Closing Comment

by:DancingFighterG
ID: 40348020
Excellent help and will be using him again for some additional development
0

Featured Post

Maximize Your Threat Intelligence Reporting

Reporting is one of the most important and least talked about aspects of a world-class threat intelligence program. Here’s how to do it right.

Join & Write a Comment

Things That Drive Us Nuts Have you noticed the use of the reCaptcha feature at EE and other web sites?  It wants you to read and retype something that looks like this.Insanity!  It's not EE's fault - that's just the way reCaptcha works.  But it is …
This article discusses four methods for overlaying images in a container on a web page
The viewer will learn how to count occurrences of each item in an array.
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…

760 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

26 Experts available now in Live!

Get 1:1 Help Now