Hi there Divi Creators! Thank you for becoming a member of us for the following installment of our weekly Divi Design Initiative the place every week, we give away emblem new freebies. We lately shared a brand spanking new Web Developer Layout Pack. That will help you get your website online up and operating once imaginable, we’re sharing an international header & footer template that fits this format pack completely as smartly! Hope you experience it.

Header Design

Desktop View

Pill and Cell View

Footer Design

Desktop View

Pill and Cell View

Obtain The International Header & Footer Template For The Internet Developer Format Pack

To put your fingers at the loose world header & footer template, you are going to first wish to obtain it the usage of the button beneath. To achieve get entry to to the obtain it is very important subscribe to our Divi Day-to-day e-mail listing by means of the usage of the shape beneath. As a brand new subscriber, you are going to obtain much more Divi goodness and a loose Divi Format pack each Monday! For those who’re already at the listing, merely input your e-mail cope with beneath and click on obtain. You are going to now not be “resubscribed” or obtain further emails.

Download the Files

.et_bloom .et_bloom_optin_1 .et_bloom_form_content { background-color: #4843d2 !necessary; } .et_bloom .et_bloom_optin_1 .et_bloom_form_container .et_bloom_form_header { background-color: #ffffff !necessary; } .et_bloom .et_bloom_optin_1 .carrot_edge .et_bloom_form_content:sooner than { border-top-color: #ffffff !necessary; } .et_bloom .et_bloom_optin_1 .carrot_edge.et_bloom_form_right .et_bloom_form_content:sooner than, .et_bloom .et_bloom_optin_1 .carrot_edge.et_bloom_form_left .et_bloom_form_content:sooner than { border-top-color: clear !necessary; border-left-color: #ffffff !necessary; }
@media best display screen and ( max-width: 767px ) {.et_bloom .et_bloom_optin_1 .carrot_edge.et_bloom_form_right .et_bloom_form_content:sooner than { border-top-color: #ffffff !necessary; border-left-color: clear !necessary; }.et_bloom .et_bloom_optin_1 .carrot_edge.et_bloom_form_left .et_bloom_form_content:after { border-bottom-color: #ffffff !necessary; border-left-color: clear !necessary; }
}.et_bloom .et_bloom_optin_1 .et_bloom_form_content button { background-color: #f92c8b !necessary; } .et_bloom .et_bloom_optin_1 .et_bloom_form_content .et_bloom_fields i { colour: #f92c8b !necessary; } .et_bloom .et_bloom_optin_1 .et_bloom_form_content .et_bloom_custom_field_radio i:sooner than { background: #f92c8b !necessary; } .et_bloom .et_bloom_optin_1 .et_bloom_border_solid { border-color: #f7f9fb !necessary } .et_bloom .et_bloom_optin_1 .et_bloom_form_content button { background-color: #f92c8b !necessary; } .et_bloom .et_bloom_optin_1 .et_bloom_form_container h2, .et_bloom .et_bloom_optin_1 .et_bloom_form_container h2 span, .et_bloom .et_bloom_optin_1 .et_bloom_form_container h2 robust { font-family: “Open Sans”, Helvetica, Arial, Lucida, sans-serif; }.et_bloom .et_bloom_optin_1 .et_bloom_form_container p, .et_bloom .et_bloom_optin_1 .et_bloom_form_container p span, .et_bloom .et_bloom_optin_1 .et_bloom_form_container p robust, .et_bloom .et_bloom_optin_1 .et_bloom_form_container shape enter, .et_bloom .et_bloom_optin_1 .et_bloom_form_container shape button span { font-family: “Open Sans”, Helvetica, Arial, Lucida, sans-serif; } p.et_bloom_popup_input { padding-bottom: 0 !necessary;}

See also  Divi Meetup Community Update: May 2023

Obtain For Loose

Sign up for the Divi Publication and we can e-mail you a duplicate of without equal Divi Touchdown Web page Format Pack, plus lots of different wonderful and loose Divi sources, guidelines and methods. Observe alongside and you are going to be a Divi grasp very quickly. If you’re already subscribed merely sort for your e-mail cope with beneath and click on obtain to get entry to the format pack.

DOWNLOAD

You’ve got effectively subscribed. Please take a look at your e-mail cope with to substantiate your subscription and get get entry to to loose weekly Divi format packs!

Methods to Add The Template

Pass to Divi Theme Builder

To add the template, navigate to the Divi Theme Builder within the backend of your WordPress website online.

Add International Default Web page Template

Then, within the height proper nook, you’ll see an icon with two arrows. Click on at the icon.

Navigate to the import tab, add the JSON report which you have been in a position to obtain on this publish, and click on on ‘Import Divi Theme Builder Templates’.

Save Divi Theme Builder Adjustments

Whenever you’ve uploaded the report, you’ll understand a brand new world header and footer for your default website online template. Save the Divi Theme Builder adjustments once you need the template to be activated.

Methods to Alter The Template

Open Header Template

To change the worldwide header template’s parts, get started by means of opening the template.

Replace Social Media Networks & Hyperlinks

First, replace the Social Media Follow Module with your individual social media networks. Take into account so as to add the right kind hyperlinks to every social media account that you just upload.

Add Your Emblem

Within the Image Module, add your brand.

Upload CTA Hyperlink URLs

This header has a button at the height proper. Open the settings of the button and replace the hyperlink URL and button textual content to check your website online’s wishes.

Choose Your Primary Menu

Make a selection your menu for the Menu Module.

Replace Textual content Modules with Name-to-Movements

We use the Text Module to have two call-to-actions at the left and proper of the Menu Module. Replace those to mirror the call-to-actions that you just’d like to make use of in your website online.

You may additionally need to believe including hyperlinks to those call-to-actions to necessary spaces of your website online.

Making ready for Cell Responsiveness

This freebie makes use of a special set of sections, rows, and modules for the pill and cellular view. As such, we’ll wish to transfer to the pill or cellular view within the Divi Builder.

Replace Button for Cell

As we did for the desktop view, we wish to replace the textual content in addition to the hyperlink vacation spot for the cellular Button Module.

Upload Your Emblem and Replace Menu for Cell

Choose your menu for the cellular model of your website online. For cellular, we’re the usage of the brand characteristic of the Menu Module. Thus, no symbol module was once used to show our brand.

Exchange Static Textual content Name-to-Movements

Finally, we’ll wish to replace the static Textual content Modules that experience our call-to-actions for cellular.

Open Footer Template

Proceed by means of opening the worldwide footer throughout the default website online template.

Replace Footer Emblem

We use an Image Module to show our corporate brand. Replace this module with your individual brand. Pleasant reminder to make use of a clear PNG for this for absolute best effects.

Choose Footer Menu

Now we have some other Menu Module within the footer of this template. Let’s choose our menu for this module.

Exchange and Upload Social Media Networks and Hyperlinks

Now we have some other Social Media Observe Module within the footer. Replace the module to proportion your social media networks and make certain that you hyperlink in your up to date social media hyperlinks.

Attach Your E mail Advertising Resolution

There’s an Email Optin Module within the footer of our Divi Internet Developer template. Make sure that you attach your e-mail advertising carrier to the module with the intention to gather the e-mail addresses of customers in your website.

Replace Static Footer Content material

It is very important undergo and replace the static content material parts within the footer. This comprises updating titles, copyright textual content and extra.

New Freebies Each Week!

We are hoping you’ve loved the Internet Developer Format Pack and the Header & Footer freebie that is going at the side of it. We look ahead to listening to your evaluations within the remark segment beneath. Make sure to take a look at again subsequent week for extra freebies!

The publish Download a FREE Header & Footer for Divi’s Web Developer Layout Pack seemed first on Elegant Themes Blog.

read more