How to Swap the Position of Social Icons and Secondary Navigation in Divi

Written by Dan Mossop

In the Divi theme secondary header, you can choose to display both social icons and a secondary navigation menu. If you do, you'll find that the social icons appear to the left of the menu. Unfortunately, there isn't currently an option in Divi to swap the social icons and secondary nav menu, so that the social icons instead display to the right of the menu. So here's how to swap the position of social icons and secondary navigation in Divi:

Swap the Position of Social Icons and Secondary Navigation using CSS

You can swap the position of social icons and secondary navigation using the following CSS:

#et-secondary-menu {
 display: flex;
 flex-direction: row-reverse;
}

Simply add it to your site, e.g. in the "Divi > Theme Options > General > Custom CSS" box, and you should then see the social icons placed on the right-hand side of the secondary nav menu.

About Dan Mossop

Dan is a Scottish-born web developer, now living in Brisbane with his wife and son. He has been sharing tips and helping users with Divi since 2014. He created Divi Booster, the first Divi plugin, and continues to develop it along with 20+ other Divi plugins. Dan has a PhD in Computer Science, a background in web security and likes a lot of stuff, 

We may earn a commission when you visit links on our website.

0 Comments

Submit a Comment

Comments are manually moderated and approved at the time they are answered. A preview is shown while pending but may disappear if your are cookies cleared - don't worry though, the comment is still in the queue.

Your email address will not be published. Required fields are marked *.

New: Divi Preferred Sources Module

The Divi Preferred Sources Module adds Google’s “Add to Preferred Sources” button directly to the Divi Builder, making it easy for visitors to follow your website as a preferred source in Google Search. Add the button to posts, pages, news content, blogs and more, helping interested readers stay connected with your content through Google’s preferred sources feature.

Learn more about Divi Preferred Sources Module