Select Page

Divi Custom Footer Guide On WordPress

  1. Home
  2. »
  3. Divi
  4. »
  5. Divi Custom Footer Guide On WordPress

Mozsteps content is free. When you purchase through referral links on our site, we earn a commission. Learn More

global divi custom footer on wordpress
  • Facebook
  • Pinterest
  • reddit
  • LinkedIn
  • Myspace
  • Tumblr

Overall, creating footers on WordPress is pretty easy, you just need to install a theme and insert the widgets you like and you're good to go. However, you're always limited to the options provided by the theme and you can customize it if you have some CSS knowledge but you cannot change things like the layout.

If you're looking to create the footer exactly the way you want then using a page builder can be extremely helpful. In today's guide, we're going to learn some tips and tricks about the Divi theme builder then show you the exact step-by-step process of creating a Divi custom footer and customizing all the details such as colors, links, icons, and the general layout.

So without further ado, Let get started right away (:

Why Create Custom Footer using Divi Builder?

You still can use the default footer that comes with the Divi theme and edit it as we have shown in our edit default Divi footer guide. But if you're interested in building a custom footer using Divi's theme builder. You might be wondering why would you create a custom footer when you can stick to the default one that comes with the theme. what's the difference?

Here are some reasons why you need to create a custom footer:

Very simple: You can create a Divi custom footer very quickly and easily using the powerful drag and drop feature in the Divi theme builder which allows you to insert, delete and customize different elements right in the front end.

Unlimited Possibilities: You can literally create any design you want no matter how complicated it is or even import one of the beautiful layouts that Divi offers in their library then customize it by adding your content.

Custom display options: The Divi theme provides high flexibility for users to display the footer anywhere on their website, whether they want it to be assigned to a set of pages or a specific page only.

Before We Start

When building a custom footer using the Divi theme builder you can use the section, rows, and modules just like you're designing a normal page.

Keep in mind that when set up and configure a custom footer from the theme builder it will replace the default footer widget area and the bottom section where the copyright text is.

If you already have some knowledge about CSS and you want to customize things even further then check our guide on how to add custom CSS to the Divi theme.

How to Build a Divi Custom Footer (Guide)

Here we are in the actionable part of this article where we walk you through creating and customizing a Divi custom footer from scratch and using a pre-made template if you're interested in saving some time.

Let's Do it!

Design a Divi custom Footer from scratch

To create a global footer from scratch using the Divi theme builder you can follow these simple steps:

1 – Navigate to Divi Theme builder

Log in to your WordPress dashboard, from the left-hand side menu navigate to Divi > Theme builder

divi theme builder
  • Facebook
  • Pinterest
  • reddit
  • LinkedIn
  • Myspace
  • Tumblr

2 – Create global footer template

The Divi theme builder comes with a default website template from which you can create a custom header, footer, and body. if you use it then it will be displayed across the whole website.

Let's start creating the template by clicking the “Add Global Footer” then from the two options that pop up click “Build Global footer”.

create divi global footer template
  • Facebook
  • Pinterest
  • reddit
  • LinkedIn
  • Myspace
  • Tumblr

You'll be given three options to choose from, You can create the template from scratch, clone an existing one, or import a pre-made layout then customize it the way you want. it doesn't really matter which method you choose so it's up to you. For instance, I will go ahead and choose the first option by clicking “Start building”.

create footer template in divi builder
  • Facebook
  • Pinterest
  • reddit
  • LinkedIn
  • Myspace
  • Tumblr

3 – Design the Divi custom footer layout

Now, it's time to start using the different sections, rows, and modules then play around with the settings associated with each one to create a layout that you like. if you have imported a layout then it will make the process a lot easier as you'll have to just fill in your content and edit colors, fonts, and those small things.

Build divi global custom footer
  • Facebook
  • Pinterest
  • reddit
  • LinkedIn
  • Myspace
  • Tumblr

Once you reach a result that you're happy with then don't forget to save the changes by clicking the “Save” button in the right corner then close the editor window using the X symbol in the top right corner and a message saying unsaved changes will pop up, go ahead and click the “Save & Exit” button.

4 – Save the Footer template

As you can see the global footer layout is now added as a default footer template to the entire website, all we need to do is to click the “Save Changes” button just above the Divi theme builder panel.

save footer template divi
  • Facebook
  • Pinterest
  • reddit
  • LinkedIn
  • Myspace
  • Tumblr

Assigning The Global Divi Footer

The method we have explained above will display the footer on all the pages of your website, now if you're in a situation where you needed to create a custom Footer to a set of pages or a specific one only like an eCommerce product page. Then the good news is that it's totally possible and yet easy to do.

To add or assign a custom global footer to specific pages in Divi theme follow these steps:

Head over to the theme builder again and this time click “Add New Template” plus button.

assign global custom footer in divi theme
  • Facebook
  • Pinterest
  • reddit
  • LinkedIn
  • Myspace
  • Tumblr

What you see below are the template settings that allow us to show the footer in a set of pages or even a single page. in the example below, I would like to assign the new footer template to all of the pages, so what will happen is the pages will have the new template as a footer and the rest of the site will have the default one we created earlier.

With being said, select the display option that suit your situation then click “Create Template”.

assign global custom footer in divi theme
  • Facebook
  • Pinterest
  • reddit
  • LinkedIn
  • Myspace
  • Tumblr

Once the new template is created the Divi theme builder assigns the default Divi custom footer we created in the previous step. Right-click on the green box and select the “Disable Global” setting.

assign global custom footer in divi theme
  • Facebook
  • Pinterest
  • reddit
  • LinkedIn
  • Myspace
  • Tumblr

The box is changed to a grey color and it shows the “Custom Footer” in the title instead of “Global Footer” which obviously means that the pages have now a separate Divi custom footer that we have full control on.

By clicking the little pencil icon shown below it will open the Divi theme builder and you can start adding content in different modules using the powerful drag and drop feature. when you finish once again don't forget to save the changes exactly as we did before.

assign global custom footer in divi theme
  • Facebook
  • Pinterest
  • reddit
  • LinkedIn
  • Myspace
  • Tumblr

Congratulations! You can now go ahead and create custom footers and make your website appear exactly like you want it to be.

Futher Reading:

Roundup

By offering the possibility for users to create and customize a custom footer for literally any part of their website. Divi builder is becoming the most powerful page builder on the market. Besides, it's actually pretty easy to use and with hundreds of free layouts, they published so far. I am sure you can find the layout you want, import it and customize it in a few clicks.

Don't forget to match the colors and fonts with the actual design of your website to make it look good and more importantly keep that consistency sort of things.

This was our guide for today, I hope it was helpful and you enjoyed it. If Yes don't forget to share it on social media. If you still have any questions or want to share your thoughts feel free to drop them in the comment section below. Otherwise, stay awesome (:

Cheers!

0 Comments
Submit a Comment

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

Start a blog at 2.75$/mo

Categories

Pin It on Pinterest

Share This