When you add any of the optional elements into your secondary header navigation they will appear left aligned as in the top image below.

If you want to move the secondary menu social icons to the right in your navigation as in the lower image below, you can use a few lines of CSS in your Theme Options or child theme stylesheet.

divi secondary navigation-social-icons

How to right-align social icons

Add the following into your Divi Theme Options Custom CSS box, or into a child theme style sheet;

#top-header .et-social-icons { float:right !important; }
#top-header #et-info { width: 100%; }

How to add secondary header elements (Phone, email, social icons)

By default, the secondary menu does not show until you choose to add the optional elements into it. To do this you will need to open your Theme Customizer and navigate to Theme Customizer > Header & Navigation > Header Elements. Here you can add your phone number and email and check or uncheck to add social media icons and show search icon.

  • Show Social Icons – If you have defined social profiles (in Divi Theme Options), then you can choose to display these in your secondary header.
  • Phone Number – Once you add your phone number in the theme customizer it will display in the secondary navigation bar.
  • Email – Once you add your email in the theme customizer it will display in the secondary navigation bar.

divi secondary menu

 

5 2 votes
Article Rating