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 June 25, 2023

Tutorial: How To Make A Header Menu With A Centered Logo In WordPress With Oxygen

hello world!

In this video tutorial, Elijah will show you how to design a header menu with a centered logo in Oxygen for your WordPress website.

You can do this by adding a few elements to the page: A section, Site Navigation, Link Wrapper, and an Image element should be sufficient. If you're using Oxygen's Emmet integration, copy and paste the following snippet into Emmet:

Next, you'll learn how to modify the styles for each element to center the logo.

Finally, you'll write some custom CSS in an Oxygen Stylesheet to finalize the design for the header menu with a centered logo. The following CSS will work with six menu items in the Site Navigation element. You may need to adjust this depending on the number of items in your Site Navigation or the element being used.

Video Table of Contents: 

  • 00:00 Introduction
  • 00:44 Adding and Styling the Elements
  • 02:25 Centering the Logo in the Menu
  • 05:26 Making the Design Mobile-Friendly
  • 06:02 Final Thoughts.

Resource(s): 

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