I seem to have multiple H1 tags on my homepage. The first one seems to be the correct one – It has taken my site title and put it as the H1 tag. The second H1 tag seems to be a duplicate of that and just below the first one but has put it in a “navigation-branding” div class for some reason.
On single post and pages, it’s fine – There is only one H1 tag.
If you look at the source code for the home page (right click, “view source”), and then search for the following string “<h1″ (by doing ctrl-F), you will see that it appears twice. The first one is inside <div class=”site-branding” and the second is inside a <div class =“navigation-branding”
This is a tough one, as there is a desktop header and a mobile header. We *could* remove the H1 from the mobile header, but that means mobile devices won’t have an H1 on the page.
Since the headers never appear at the same time, I think it’s a non-issue. Even Google says that multiple H1 elements per page isn’t an issue:
I faced some issue and I think it’s easy to fix by using this method
(wp_is_mobile()) ? $showH1 : $hideH1 ;
But how to use it with generate_site_title_output ?