[Resolved] screen-reader-text

[Ignacio]

Hello,
What is it and what does this link do in the code?

<a class="screen-reader-text skip-link" href="#content" title="Saltar al contenido">Saltar al contenido</a>

It’s right after the body tag.

Regards

[Tom]

Hi there,

It’s an element visible to people using screen readers. It’s an accessibility feature which allows them to navigate and use your website easier.

[Ignacio]

Hello,

Ok Tom, thank you so much for responding.

regards

[Tom]

No problem! 🙂

[Ignacio]

Hi

A doubt, how can i deactivate that line of code ?

Regards

[Tom]

If you really have to, you can do this:

remove_action( 'generate_before_header', 'generate_do_skip_to_content_link', 2 );

[Ignacio]

hello

I’ve added a snippet with the function and it doesn’t remove the code. What other solution could there be ?

Regards

[Tom]

How did you add the code?

[Ignacio]

Hi Tom

with the Code Snippets plugin

Regards

[Tom]

Try this instead:

add_action( 'after_setup_theme', function() {
    remove_action( 'generate_before_header', 'generate_do_skip_to_content_link', 2 );
}, 50 );

Let me know 🙂

[Ignacio]

Okay, perfect. It works.

Thanks !

[Tom]

No problem! 🙂

[Hilton]

Hi Tom,

It seems that hiding text and links is a practice outside the Webmaster Quality Guidelines, as stated in the following URL: https://support.google.com/webmasters/answer/66353?hl

This way, how can I also remove these codes from pages:

<li class="search-item" title="Pesquisar"><a href="#"><span class="screen-reader-text">Pesquisar</span></a></li>

<div class="mobile-bar-items">
<span class="search-item" title="Pesquisar">
<a href="#">
<span class="screen-reader-text">Pesquisar</span>
</a>
</span>
</div>

Thanks

[Tom]

When it comes to Google, you don’t need to worry about the screen reader text: https://www.searchenginejournal.com/google-using-hidden-text-for-screen-readers-will-not-hurt-rankings/294605/

[Hilton]

Ok Tom, thanks for the explanation.

[Author]

Posts