[Support request] Slideout menu markup shows on page source

[George]

A client of mine noted from his SEO tool that the main menus is duplicated on all pages. I have my main menu shown on Primary Menu and Off Canvas Menu. Off canvas panel is set to load on mobile only. Looking at the source code, it seems that the off canvas menu markup is being displayed at the bottom of the page towards the footer. As a result, there is menu duplication that Google considers as keyword stuffing. The site is behind WP Rocket and Cloudflare but I have cleared all cache and also tested on a local site with caching deactivated. The issue persists.

[George]

I’ve also tested on a local site. Even when the menu is not assigned to the Off Canvas Menu position, the menu slideout markup is still visible in the page source. Only when setting Off Canvas Panel to Off in the Customizer the markup is completely gone. This seems to be a default behavior, it creates SEO issues, though.

[David]

Hi George,

i am not sure this is a real issue.
If it were then every site using an alternative mobile menu, off canvas panel, duplicate sidebar menu or had menus in their footers would be an issue. It is also common practice in responsive design to have alternative HTML for different device navigations and search engines are aware of that.

Regarding the crawling of a site, my ( limited ) understanding is as follows:

a, Google caches the Raw HTML which will include all the HTML including those duplicate links.
b. Google saves a rendered HTML of the page ie. ‘View Crawled Page’ – which will in part exclude any hidden content. eg. a nav element that is set to display none.

It is that crawled page that is used for the indexing.

So considering all of the above, i think it may be overzealous SEO software at fault…..

[George]

Isn’t there a way for the duplicated content not to appear at all? I am not sure what the theme does is the right approach as a simple display: none could be misinterpreted differently.

[David]

Isn’t there a way for the duplicated content not to appear at all?

You could use the wp_is_mobile function to determine the device the site is opened on and to unhook what you don’t require on mobile ( or desktop ).
But if you have page caching on the site then that would have to support separate caches for mobile and desktop.
But you run the risk the caches get messed up and the incorrect HTML gets displayed, which in the worst case could result in no nav being output.

The way that GP does it ie. using display: none; is the most effective and accepted way of doing it.

As an example take a look at either SemRush or Moz – considering those are both SEO experts, i would consider them a good benchmark as to what is a good or bad… and they both have separate HTML therefore duplicate nav menu items for their mobile menus.

[George]

I am not sure, I am seeing what you mention in SemRush or Moz. They have a menu at the top and one at the bottom. They are not hiding anything with display: none.

[Author]

Posts