Skip to content

Footer Template Extension

This will allow you to design the Divi Theme Footer using the Visual Builder/Backend Builder. The template will be automatically applied as the footer.

Currently, the template will only support the following:

  • Divi Theme

Once ElegantThemes updated their Template Hook on Extra Theme, this template will also be available to Extra Theme.

Usage

Before using Footer Template, you need to make sure you Enable Divi Builder on Post Types by going to your Divi Theme Options and navigate to Builder to make sure that Divi Builder is enabled on the Footer Template.

Divi Supreme Footer Template CPT Extension

To use Footer Template, login to your WordPress admin panel, on the admin menu, navigate to the Divi Supreme Pro -> Footer Template. This will work with either the Visual Builder or the Backend Builder.

Divi Supreme Footer Template Extension

If you do not see Footer Template under the Divi Supreme Pro, propably you haven't enable it yet. Please take a look at How to Enable Divi Supreme Extension

This is an example on how we designed our website Footer using Visual Builder.

Divi Supreme Footer Template Example

Note: There's a bug with the Visual Builder on Custom Post Types when using all 3rd party modules. You may notice some styles are not rendering on the fly in Visual Builder. But not to worry because it's perfectly fine and rendering well on the frontend. Make sure you check on your frontend too! We have reported this to the Divi GitHub and they aware of it.

https://github.com/elegantthemes/create-divi-extension/issues/190

Footer Template comes with few options. You can configure the footer settings to suit your needs.

Divi Supreme Footer Template Options

Assign Template to:

Currently you can only assign them to the footer. We have plans to make this to the header as well in the near future.

Conditional

By default, the footer will show up on all pages/post. If you would like to use the WordPress Tags rules for your footer, you can define them here. If you want them to choose on all except for home page and other pages, here's an example !is_home() || !is_page('123') or leave it blank if you do not wish to have it.

CSS Classes

If you would like to use your custom css classes on your footer, add it here. Specify the css classes here example divi-footer-dark your-custom-css, or leave it blank if you do not wish to have it.

This will show the footer when using Visual Builder in other pages/post/custom post type.

Note: For now, it is better not to embed it because of the lack of getting style in the Divi API. We've also reported this to Divi GitHub and this was marked as Improvement. Hope to see this added soon by the ElegantThemes.

https://github.com/elegantthemes/create-divi-extension/issues/179

If you like to embed them in the Visual Builder, Tips: To have better experience with Visual Builder and the Footer Template, it is advisable that you either Disable the Static CSS File Generation or enable both Static CSS File Generation and Output Styles Inline during development in order to view the footer render properly in the Visual Builder.