Divi Theme Builder: A Review and Overview

In 2019, Elegant Themes (the developer of Divi) introduced Divi 4.0, which included a brand-new feature to allow you to customize every single part of your website. The feature — called Divi Theme Builder — allows you to create custom templates to replace the default templates of your theme parts without PHP knowledge.

With the release of Divi 4.0, you no longer need to rely on the customization options offered by Divi (or any theme you use). Instead, you can use the Divi Theme Builder feature to create a certain custom template using the visual editor of Divi Builder.

You might be wondering, what is a theme builder?

A Little Intro About Theme Builder

To learn the concept of theme builder, you can read this article, which covers about theme builder comprehensively. The point is, a theme builder allows you to create a custom template to replace the default template of your theme (e.g., the header template). In most cases, theme builder is available as a built-in feature of a page builder plugin. Some page builder plugins that have a theme builder feature are:

• Divi Builder
• Elementor
• Brizy

How Divi Theme Builder Works

Have you read the article on the link we mentioned above? A theme builder allows you to create custom templates to replace the default templates of your theme parts. So does Divi Theme Builder. You can create the custom templates using the visual editor of Divi Builder.

Before creating a template, you can define where the template to applied. Whether to the entire website or specific pages only. The theme parts you can create the custom templates of are:

• Header
• Footer
• Single Post
• Category Pages
• Tag Pages
• Author Pages
• Search Results Page
• 404 Page

If you use WooCommerce, you can also use it to create custom templates for the following parts:

• Single Product Page
• Product Category Pages
• Shop Page
• Cart Page
• Checkout Page
• My Account Page

Divi Theme Builder supports display conditions. Meaning that you can select specific pages or posts where a certain template to be applied. For instance, when creating a custom header template, you can set it to be applied to the entire website, specific posts, specific pages, posts under certain categories, posts with certain tags, posts written by a certain author, and so on.

How to Create a Custom Template Using Divi Theme Builder

In general, the custom templates in Divi Builder fall into three types:

• Header
• Footer
• Body

The body template covers single post template, category pages, tag pages, author pages, and so on.

To start creating a custom template, you can go to Divi -> Theme Builder on your WordPress dashboard. Once you are on the theme builder page, click the plus icon to add a new template and specify where you want the custom template to be applied and click the Create Template button.

Next, you can click Add Custom Header to create a header template, Add Custom Body to create a body template, and Add Custom Footer to create a footer template. You have two options to start creating the template.

First, you can create the template from scratch. Second, you can create the template from a premade template on your library.

If you want to create the template from scratch, you can select the Build Custom Body option. Clicking this option will take you to the Divi Builder editor where you can create the template. You can read the following articles for detailed instructions on how to create custom templates in Divi Builder:

• How to create a custom header in Divi Builder
• How to create a custom footer in Divi Builder
• How to create a custom single post template in Divi Builder
• How to create a custom category pages in Divi Builder
• How to create a custom 404 page in Divi Builder
• How to create a custom single product page in Divi Builder
• How to create a custom product category pages in Divi Builder

Once you are done creating the template, you can click the X icon on the top-right corner of the Divi Builder editor. This will close the Divi Builder editor.

You will be directed back to the theme builder page after clicking the X icon above. Make sure to click the Save Changes button to apply the changes.

Editing an Existing Template

If you want to edit an existing template, you can simply hover your mouse over the template you want edit and click the pencil icon. This will open the Divi Builder editor.

To edit the display conditions, you can click the gear icon above the template block. To delete the template, you can simply click the trash can icon.

How to Import a Premade Template

Unlike, say Elementor, Divi Builder offers no premade templates for theme builder on the template library. It doesn’t mean that Elegant Themes doesn’t offer premade templates at all. Elegant Themes regularly releases new premade theme builder templates via blog posts.

One of which is this one. You can import a premade template from the theme builder page, instead of the Divi Builder editor. Otherwise, you will face an error (read this post if you face an error when importing a template in Divi Builder).

To import a premade template, first, prepare the file of the template you want to import (the JSON file). Once the file is ready, go to Divi -> Theme Builder and click the two-arrow icon on the right side.

Click the Import tab on the appearing popup, followed by NO FILE SELECTED to select the JSON file of the template you want to import. End by clicking the Import Divi Theme Builder Templates button.

Wait a moment until Divi Builder is done importing your template. Once done, click the Save Changes button to apply the changes.

Exporting Your Template

Want to export a custom template you have created? To do so, you can hover your mouse over the template block you want to export and click the two-arrow icon above it.

On the appearing popup, give your template a name and click the Export Divi Theme Builder Template button. Wait a moment until Divi Builder is done exporting the template. Once the exporting process is done, Divi Builder will automatically download the JSON file to the Downloads folder of your computer (Windows).

The Bottom Line

Since version 4.0, Divi Builder brought a new feature to allow you to create the custom templates to replace the default templates of your theme parts. This gives you an opportunity to create a fully unique website with your own design.

You have limitless options to customize every single part of your website. Features like sticky option, CSS transforms, and motion effects allows you to take your design even further. You can apply certain behaviors to your template. Not to mention the ability to display the custom fields data, which allows you to create a fully customized, complex website without coding at all.