• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar

WP SITES

2785

Original Genesis & WooCommerce Tutorials & 6000+ Guaranteed Code

Snippets

  • Try Premium
  • Log in

Align Logo Left With Menu Right In Essence Pro

This tutorial shows you how to reposition the primary nav menu to the right inline with the custom logo on the left using the Essence Pro child theme by StudioPress.

The solution is mobile responsive as seen in the demo video.

Also, the method used doesn’t require any modification of the default code in Essence Pro.

Here’s the result for the desktop view :

Desktop

Demo Video #

Shows the custom logo to the left and the primary nav menu moved so its inline with the logo on desktops and centered below the logo on smaller screens.

Installation Steps

There’s 3 steps :

# Step 1 – Upload your logo using Customize > Site Identity > Logo.

Step 1

# Step 2 – Copy & paste the PHP code from the functions.php file to the end of the Essence Pro themes functions file.

Register for full access


Download Folder

Custom Logo Essence Pro Theme Nav Menu

Reader Interactions

Comments

  1. John Peacock says

    July 26, 2020 at 10:31 pm

    I would like a tutorial on how to use ‘Align Logo Left With Menu Right In Essence Pro’ with ‘Add Header Right Widget For Social Icons To Essence Pro: https://wpsites.net/web-design/add-header-right-widget-for-social-icons-to-essence-pro/ ‘
    to show header right widget in place of navigation.

    So on large screens primary navigation will stay below the logo and the social icons will be aligned perfectly to the right of the logo.

    On smaller screens, under 1024 px, the mobile hamburger menu will be to the right of the logo, then under that will be the list of social icons . When you click on the mobile menu it will open up under the logo and social icons.

    …. . fun right 🙂

    thanks for all your tutorials

    Log in to Reply
    • Brad Dalton says

      July 27, 2020 at 2:25 am

      No problem. Here’s the policy on additional tutorial requests. $75 https://wpsites.net/terms-of-service/#additional-tutorial-requests

      Log in to Reply

Leave a Reply Cancel reply

You must be logged in to post a comment.

Primary Sidebar

Code written by Brad Dalton specialist for Genesis, WooCommerce & WordPress theme customization. Read More…

Advertise · WPEngine · Genesis · Log in

  • Access Problems
  • Account Details
  • Consulting
  • Tags
 

Loading Comments...
 

You must be logged in to post a comment.