In this tutorial, we will show you how to add accessible Skip Links for your WordPress website using Oxygen. Skip Links are an important accessibility-friendly feature for websites and allow keyboard users to efficiently move past long lists of elements, such as a menu or repeated content. These are generally found at the very top of the website and allow users to skip through the navigation menu and go directly to the page's content.
To create a Skip Link in Oxygen, we'll start by opening our Main template. We'll then add an Inner Content element and assign it the main tag. Next, we'll wrap the Inner Content element in a Div element and assign the Div element the ID "main".
After this, we'll add a Text Link element, which will become our Skip Link, to the top of the Main template. We'll give it a basic description, such as "Skip to Main Content", and set the URL to "#main".
Next, we'll style our Skip Link so that the element isn't visible when the page loads but shows once a user tabs through the page.
If you have access to Oxygen's Composite Elements, you can quickly add an accessible Skip Link element to your site.
References and Tools: