Broken Anchor Links #content

[Ellen]

My technical site auditor is finding broken anchor links on all the pages of my site. The one I noticed it first on a site using the Circumference theme, but I’m also noticing it on the Preferential theme as well and the Sleeky Pro theme, only there I’m seeing them as #cancel and #print links that are broken.

Two examples: http://greenleaf.biz & http://sun-windsolutions.com/ & http://www.earthturfwood.com

I don’t know what is causing it, but I suspect there may be a problem with one or more templates?

Attachments:

You must be logged in to view attached files.

[Bidur]

Hi,

We can’t under what you are trying to say. Please clarify more. And we haven’t put any anchors in template it is added while adding content so also please can you check on that while you have added anchor links in content.

Thanks

[Ellen]

No anchor links have been added by me. I’m wondering if it may be related to the “skip to content” screen reader links. Are the screen reader links defined but not identified in the page template?

For example, on this page (http://greenleaf.biz/customers/) This is in the page source:
Skip to content

The #content anchor link is supposed to link to http://greenleaf.biz/customers/#content

But that doesn’t exist on the page.

[Sushil Adhikari]

Dear Ellen,

We have visited this link[ http://greenleaf.biz/customers/ ] but couldn’t find any links that end with #. Could you tell us how we can produce that broken link error so we can track the issue and can provide you appropriate solution.

We look forward for your response.

Thanks

[Ellen]

Sushil,

The link is embedded in the page. You will have to look at the code to see that is is there. Just below the header you will see this link on line 298. //< a href=”#content” title=”Skip to content”>Skip to content

Here is the code within that bit of context:

</header>

<div id=”secondary-nav” style=”background-color: #000000;”>
<div class=”container”>
<div class=”row”>
<div class=”col-md-12″>
<div id=”navbar” class=”navbar”>
<nav id=”site-navigation2″ class=”navigation main-navigation” role=”navigation”>
<div class=”menu-toggle-wrapper hidden-md hidden-lg”>
<h3 class=”menu-toggle2″>Menu</h3>
</div>
// < a href=”#content” title=”Skip to content”>
Skip to content</ a>
<ul id=”menu-greenleaf-main-menu” class=”nav-menu”>

Do you know where this is coming from?

• This reply was modified 6 years, 6 months ago by Ellen.
• This reply was modified 6 years, 6 months ago by Ellen.

[Sushil Adhikari]

Dear Ellen,

Skip to content is especially made for accessibility read , it is used by visually impaired person.

You can find the skip to content on header.php template. Please use child theme header.php template to remove the skip to content link, Otherwise your custom changes will be lost on theme update.

Let us know if you have any doubt on this.

Thanks

[Ellen]

I’m sorry, but I need to ask this again. I did (as suggested above) comment out the skip to content code as a temporary fix to avoid having broken anchor links show up on all pages of the site. But I would like a better solution.

I do see where the reference is in the header.php file to skip to the main content for screen readers. What DOESN’T work though is the destination of that anchor link (i.e., where the accessibility reader is supposed to skip TO) is not found in the template either on the header.php file or the page.php (or whatever other template from the theme the page is using).

I see this occurring on both the Circumference and the Preferential themes, I’m not sure if it is in any of the others.

Here is the code from the Preference header.php file:

<?php _e( ‘Skip to content’, ‘preferential’ ); ?>

I believe the problem is not in the above code, but either at the end of the header.php template or in another page template that contains the page content. I haven’t been able to find that yet. Either that or the name #content is not correct and simply needs to be named correctly to find the content.

I hope this makes more sense.

[Sushil Adhikari]

Hi Ellen,

You can bookmark the content on skip the content. You can follow the example described here.
For bookmarking the link you can place content id on to href. For more details please take reference of this article

Let us know if you find any problems with this.

Note: Please use child theme to customize header.php so your changes will not lost on theme update. And also please proceed only if you are technically sound on WordPress.

Thanks

[Ellen]

Hi Sushil,

Thanks for getting back to me. So are you saying there isn’t a bookmark link in the theme’s page templates at all?

I’m surprised you didn’t add one to the theme page templates. Why add the skip link to the header if you aren’t going to add the bookmark? Seems average users wouldn’t know to add it. This makes the theme unfriendly to screen readers and also gets picked up as a broken link in SEO tools. A broken link on every page does not help a site’s SEO.

***update***
I see the link is looking for div ID “content” which I’m not seeing in the header or page templates. Seems like this should this be changed to an ID that exists in the theme somewhere.

Ellen

• This reply was modified 6 years, 1 month ago by Ellen.

[Sushil Adhikari]

Hi Ellen,

We will update our themes fixing this issue, soon…

And sorry for the inconvenience caused.

Thanks

[Ellen]

Hello, just checking to see if this has been fixed yet.

[Sushil Adhikari]

HI Eleen,

We will let you know about the update. Please keep patience.

Thanks

[Sushil Adhikari]

Hi Eleen,

We have updated to version 5.0.5, please update your theme to latest version to fix skip to content issue.

Note: Please take a backup of your theme before updating, so you can take a action if disaster strikes.

Thanks

[Ellen]

Wonderful! Thanks for all your help Sushil!

[Sushil Adhikari]

You are most welcome Eleen, Happy to help you

Thanks

[Author]

Posts