Don’t you think that the top header of Divi’s secondary menu is wasted? By default there are really few elements you can add … there is so much wasted space!
Wouldn’t you like to add some text, call to action or something?
Well, you have 2 ways to do it: one free and one very cheap.
Table of Contents
Add elements to Divi’s top header with a plugin
If you do not want to complicate and you are one of those who like to activate things with a click you have this jewel called Divi Booster that serves for this and much more.
You just have to install and activate the plugin to implement its full potential.
Specifically, to add text to the top header of Divi simply see its configuration page in Divi → Divi Booster → Header → Top Header → Add text to top header, check the box and put the text or HTML you want.
This text you add will be displayed before the phone and other items in the secondary menu of the top header of Divi.
The great thing about this method is that it allows you to use HTML in the text box, even adding links.
For example, you can add something like this:
Don't miss on <a href="/discounts"><strong>today sales</strong></a> with a <strong><em>25% discount</e></strong>Code language: HTML, XML (xml)It will look great, with the functional link, everything to your liking…
Add elements to Divi’s top header with a code
You’d rather not spend a bit on Divi Booster and do it on your own? No problem!
Go to your website administration and access the Divi menu → Theme Options → Integration.
Activate the header code and add the following:
<script>
jQuery(function($){
if (!$('#et-info').length) {
$('#top-header .container').prepend('<div id="et-info"></div>');
}
$('#et-info').prepend('<span style="margin:0 10px">My text example</span>');
});
</script>Code language: HTML, XML (xml)Like this, as in this capture:
Save the changes and that’s it, you will get the same result as with the plugin.
Now you can take advantage of all that wasted space in the secondary menu of Divi.
