Divi Theme Builder Template Support

Context – Blog Posts

It is very normal to add the featured image of a blog post or other post type as a header, background, or first image in a Theme Builder template assigned to the posts. This is possible with Dynamic Content, a feature in Divi that allows you to add an element once and the content changes automatically based on the post. So n this example, the featured image changes in the template based on whichever post is being viewed.

Use Case – Blog Category Pages

This brings us to taxonomies. If you create a Theme Builder template for blog post categories, you would normally include a module to display the category name, and a Blog module to display all the posts in that category. But you will notice one important thing missing — there is no option to show a featured image using Dynamic Content. That’s because WordPress does not have any such image feature. The Divi Taxonomy Helper adds that image support, and also adds the ability to select and display those images inside the Theme Builder template.

How To Add Taxonomy Images To The Theme Builder Template

Add A Template

Start by going to Divi>Theme Builder from your WordPress Dashboard. Here you will see any templates that you have already set up. If you already have a template for your taxonomies, such as a blog post category template, then go ahead and edit the existing one. If not, you will need to create a new template. The important part is assigning it to the correct location. For categories, you would select All Category Pages template. Then click the blue “Create Template” button. We discuss this in more detail in the video embedded above.

Edit The Layout

Once the template is added, click on the “Add Custom Body” area and select “Build Custom Body.” This will immediately open up the template, where you can begin editing the Divi layout.

You are free to design the Theme Builder template layout however you want. However, this guide will only be discussing things relevant to our plugin.

Add The Taxonomy Image

There are several places you can add the taxonomy image. The most common modules to use with dynamic content would be:

• Image module
• Post Title module
• background image of section header

We will discuss two examples in detail below, the Image module and a background image in a section.

Open the Image module settings and remove the placeholder image. Hover over the top-right corner of the “Add Image” screen and select the gray “Use Dynamic Content” icon.

A dynamic background image can be added in any section, row,  or module, but we will will use a section as the example. Open the blue section settings and open the “Background” toggle and click on the “Image” tab (the 3rd tab from the left). Remove any placeholder image. Hover over the top-right corner of the “Add Background Image” screen and select the gray “Use Dynamic Content” icon. 

The main thing to understand is that the Featured Image is the same image that you have added to the taxonomy term. So you are choosing where that image is displayed here on the page that relates to that taxonomy term.