How to edit your footer in Divi Theme
Getting the Most Out of Your Website Footer
The Divi footer makes use of sections and widgets in your WordPress Theme Customiser tool. This is not the Divi Visual Builder.
This means it can seem hard to find for the basic Divi Theme user. What makes this difficult is the footer area does not use the Divi Page Builder tools. All the modules and sections you are used to cant be used. The footer makes use of WordPress Widget tools that are used to populate widget areas, also know as sidebars.
In this set of simple tutorials we show you, step by step, how to make simple edits to make great footers. You can use the Widget tools or make use of Divi Library items by using our free Footer Plugin for Divi. Lets jump in a discover how to make that happen.
The 3 Parts of the Divi Footer
The Divi Footer is comprised of three parts. They are as follows:
- The Widget Area
- The Footer Menu
- The Bottom Bar
The Widget Area and Footer Menu are completely optional. These sections are easy to hide and do not need to be visible on your website. It’s possible to remove bottom bar also, but does require some custom code in order to do so.
You can manage the Divi Footer via the WordPress Dashboard in either the Customiser or Appearance menus.
How to Edit the Divi Theme Footer
Step 1. Theme Customizer
Go to the Theme Customiser. You can access the Theme Customiser from two different areas on your WordPress Dashboard. Both will take you to the same page.
The first option is to select Divi > Theme Customizer from the main left-side menu (as shown in the screenshot below).
Alternatively you can select Appearance > Customize (as shown in the next screenshot).
Step 2. Customizing Footer
Once you are inside the Theme Customizer, select Footer from the menu list. Here you can edit the basic setting for the default Divi Footer.
Once you are inside the Footer menu, the Theme Customiser will present you with five different options to set your styles. Note: the actual content for these settings is handled inside the widgets themselves. More on this later.
- Layout – Use this to control your number of columns.
- Widgets – Controls how your widgets appear and what colors are used for the widgets.
- Footer Elements – Use this to control your Social Media Icons.
- Footer Menu – Use this to place a horizontal footer menu between the widget area and the footer bar.
- Bottom Bar – Use this to control the copyright information. It allows you to enter HTML.
Step 3. Customizing Footer Layout
The Layout menu is where you can change the column layout and the background color of your footer. Note these setting only apply to the Widget Area of the footer.
As you can see in the above animation, the positioning of the Widget Areas can be controlled within the Layout option. Column Layout Options do not impact The Footer Menu and Bottom Bar.
In contrast, the Footer Background Color selector will change the entire background color of all three footer areas.
Step 4. Customizing Footer Widgets
The Widgets menu is where you can edit the Header, Text and Link styles and the Bullet Color. Play around by changing your header size, link color, bullet color etc. Any changes you make here will only apply to the Widget Area of your footer. As mentioned previously, the content of a Widget is managed in the Widget itself.
Step 5. Customizing Footer Elements
The Footer Elements menu controls the display of Social Media Icons.
All you can do is either choose to show the icons or hide them. If you do want to edit the social media items and the links shown, you need to go back to the Admin Dashboard and open Divi > Theme Options.
It’s at this point you may start to realise that Divi is missing a number of other social networks. If you want to add more social media icons we have a free plugin for that – Extra Icons Plugin for Divi. This will add over 10 additional social media options!
Step 6. Customizing Footer Menu
Note if you haven’t allocated a ‘Footer Menu’ (in the Menu Settings), then you wont be able to see the footer menu or any changes you make to these settings. To go ahead and allocate a menu, go to back your WordPress Dashboard and select Appearance > Menus.
In the Edit Menus tab, select a menu to edit or create a new one. Give it a name to make it easily identifiable, for example ‘Footer Menu’. Once you have selected or created your menu, make sure you tick ‘Footer Menu’ in the Display Location to ensure the menu will become visible (see the screenshot below). Save your changes. Now refresh your webpage to see the menu in your footer!
Now you have the Footer Menu under control, the last element you are left with is the Bottom Bar.
Step 7. Customizing Bottom Bar
The Bottom Bar display’s at the very bottom of your footer. It appears on every page of your website. Here you can edit the bar background color, text styles, and the social media icons color and size.
You can also choose to enable or disable the Footer Credits in these setting by ticking or unticking the box. By default the Footer Credits display a link to Elegant Themes. Some users get stuck on how to edit this text. As you type text into the Edit Footer Credits box you will immediately see the text updating in the footer. You can also add HTML in this area to create links.
As you can see, the Divi Footer styling options are all nested outside of the typical Divi Builder pages inside the Theme Customizer. The Divi Theme uses this method as standard WordPress implementations. Most WordPress themes also make use of Widgets and the Theme Customiser for editing footer styles.
The good news is if you want to use a Divi Layout in your Footer, you can with one of our free plugins. You can download it directly on the WordPress.org repository or get it here on our website. There is also a premium version with extra features if you wish to upgrade after trialling the free version!
Frequently Asked Questions
Go to the Theme Customiser.
Open the Footer Menu. Select the Bottom Bar Menu Option. Enter your new footer text in the Edit Footer Credits text box.
The Default footer cannot be hidden once it is set. Its a global item.
If you want to change the footer based on page types you will need custom code. If you want to use Divi Library items then the Divi Footer Plugin will help you.
The best way to do this is with a plugin. You will need a Divi Icon Toolkit plugin that adds new social media options to your header and footer.
We have a plugin available for free on the WordPress.org plugin repository.
In the WordPress Dashboard go to the Divi > Theme Options.
Scroll down and you will see the ability to show or hide each social media item along with a text box for adding your link.
Send us an email and we will generally respond within 1 business day. We like to know questions people have so we can answer them here.
Footer Plugin for Divi
Use the Divi Builder to make global and section footers with the Footer Plugin for Divi.