Now is your last chance to buy a lifetime license before we switch to annual pricing. Existing licenses will be unaffected.
read more
Posted on February 26, 2023

Tutorial: How To Create Accessible Skip Links for Your WordPress Site Using Oxygen

hello world!

In this video tutorial, we'll create a Skip Link for your WordPress website built with Oxygen. Skip links are generally found at the very top of a website and allow keyboard users to quickly move past your website's header and go directly to the page's content. They can also be added to areas where you have a lot of repeated content.

To begin, we're going to open our Main template. We'll set the Inner Content element to use the main tag for HTML. Next, we'll wrap the Inner Content element within a Div element and assign that Div element the ID "main".

Then, we will add a Text Link element to the top of our Main template; this will become our Skip Link. We'll set the description to something clear, such as "Skip to Main content" and then set the URL to "#main".

Finally, we'll add styles to our Skip Link to prevent it from showing when the page loads, and then have it show when a user tabs through the page's content.

If you have access to Oxygen's Composite Elements, we have a pre-built Skip Link element you can use to get started.

 

References and Tools:

 

Leave a Reply

Your email address will not be published. Required fields are marked *

Get Oxygen Today

Lifetime, unlimited site license

Copyright © 2024 Soflyy
linkedin facebook pinterest youtube rss twitter instagram facebook-blank rss-blank linkedin-blank pinterest youtube twitter instagram