Recreate the top header phone / email in a module

|

The Divi default header can be configured with a secondary header which displays, among other things, a phone number and email address. If you use a custom header built in the theme builder, you won't be able to make use of this secondary header. Here's how you can recreate the phone / email portion in a module that can be placed in your theme builder header.

To do so, add a code module to the page and then paste the following into it:

<style>
  .my-phone { 
  	margin-right: 13px;
  }
  .my-phone:before {
    font-family: ETmodules;
    content: "\e090";
    position: relative;
    top: 2px;
    margin-right: 2px;
  }
  .my-email:before {
    font-family: ETmodules;
  	content: "\e076";
    margin-right: 4px;
  }
</style>
<a class="my-phone" href="tel:0412341234">04-1234-1234</a>
<a class="my-email" href="mailto:test@test.com">test@test.com</a>
Now you'll have something that looks like this:

This post may contain referral links which may earn a commission for this site

Divi Booster

Hundreds of new features for Divi
in one easy-to-use plugin

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 *.