In this tutorial, we're going back to the basics and discussing creating headers and designing them with Oxygen.
First, we will discuss what defines a header by seeing what the Mozilla Developer Network (MDN) defines as a header, and look at a few examples across the web.
There are two primary ways to add a header in Oxygen. The first method is to use Oxygen's Header Builder element. We'll review some common use cases for this element and how to use the Sticky and Overlay features of the Header Builder element.
The second method to add a header in Oxygen is to use a Div element and create a header manually. When using this method, we recommend ensuring the HTML tag for the Div element is set to header.
Additionally, we'll discuss using the new Site Navigation element, added in Oxygen 4.3, which displays WordPress Menus with a focus on easy-to-use features and is accessibility-friendly. The Site Navigation element also includes some built-in Call to Action, or CTA, functionality, making it easy to let users interact with your site.
Throughout this tutorial, we'll use various tools and features in Oxygen, such as template creating and application, using classes, creating a custom navigation, and modifying CSS with a Code Block element.
Video Table of Contents:
Resources:
