Divi 5 introduces a more structured and scalable approach to working with dynamic content, enabling you to build templates that automatically adapt to your content and design needs.
Dynamic Content in the Element's Content Tab
In the Content tab, dynamic content allows you to integrate real-time data from WordPress, ensuring your layouts remain flexible and content-aware, such as:
Page/Archive Title
Post or Page Excerpt
Post or Page Publish Date
Post or Page Comment Count
Post or Page Link
Post or Page Author
Author Bio
Site Title
Site Tagline
Current Date
The Dynamic Content also allows you to display the values of native custom fields, ACF Fields, or Toolset Fields.
Access Dynamic Content in the Element's Content Tab
Note: This applies primarily to text-based modules, such as Text, Blurb, Call to Action, and Button modules, among others.
Open the module's settings by clicking on the Gear Icon or by clicking on the module itself.
In the Content tab, hover over any text-based option, such as Body, Title, or Module Link URL.
Click on the Dynamic Content icon
.
Choose any of the available options.
Note: Clicking on the Manage Global Strings option (at the top) will open the Global Variable Manager, where you can define Global Strings that can be used in the Dynamic Content.
Use Case: Author Bio in a Blog Post Template
Let’s say you’re building a blog post template in Divi 5, and you want every post to automatically show the author’s name, publish date, and a short bio pulled from a custom field.
Open the Divi Theme Builder
Create or edit the template assigned to All Posts.
Add a custom Body layout using the Divi Builder.
Insert Dynamic Content into Modules
Add the Post Title Module: Automatically pulls the title of the current post.
Add a Text Module for each meta information:
Use the dynamic content icon to insert:
Author
Publish Date
Add another Text Module for the author bio:
Click the dynamic icon and choose Author Bio.
Style It
Add spacing, fonts, icons, or a divider to separate the bio section visually.
In this example, every blog post now dynamically displays its title, author name, publication date, and author bio, eliminating the need for manual updates or duplicate content.
Dynamic Content in the Element's Design Tab
In the Design tab, Divi 5 introduces a new layer of dynamic control: Design Variables. These act as global tokens for values such as colors, fonts, spacing, and text strings.
Instead of manually adding different values for padding, margin, or colors, you reference a variable, allowing you to update the design across your site from a single location.
Whether you're building a post template that pulls in live metadata or using variables to unify styles across modules, Divi 5's dynamic content system helps you build smarter, faster, and more consistently.
Access Dynamic Content in the Element's Design Tab
Note: To use Dynamic Content in any of the design option groups, please make sure that you have created at least one Global Variable. For example, you can create numeric global variables for spacing, font family, colors, and much more.
Open the module's settings by clicking on the Gear Icon or by clicking on the module itself.
In the Design tab, open the Option Group for which you want to use a Global Variable (for example, Spacing option group).
Hover over the option for which you want to set a Global Variable (for example, Padding Top)
Click on the Dynamic Content icon
.
Choose the Global Variable you want to use
Notes:
Depending on the option to which Global Variables are applied, only the supported types will be shown. For example, only the Number Global Variable will be displayed if Dynamic Content is used on options such as Spacing or Border.
Depending on the supported Global Variable, the Manage Global button will dynamically show:
Numbers if the option accepts Numbers
Fonts, if the option accepts Fonts
Color, if the option accepts Colors
Clicking the Manage Global Numbers button opens the Global Variable Manager with the selected type.
Use Case: Branded Button Styles Across a Website
Suppose you're designing a corporate website in Divi 5. You want all buttons to share the same branded look - same color, rounded corners, font, and hover effect - so that if the brand styling ever changes, you only have to update it once.
Define Global Variables
Open the Variable Manager from the Visual Builder.
Create the following variables:
A Color variable named Primary Brand Color and the value
#1A73E8
.A Number variable named Button Radius and the value
6px
.A Font variable named Main Font, and choose the Montserrat font.
A Text variable named Button Label, and the value Learn More.
Apply to a Button Module
Add a Button Module to any location in your layout.
In the Design tab → Button
Enable the Use Custom Styles for Button option.
For the Button Background color, click on the Global option and choose the Primary Brand Color variable.
For the Button Text → Button Font, click the Dynamic Content icon and choose the Main Font variable.
For the Button Border → Border Radius, hover over any of the four corners, click the Dynamic Content icon, and select the Button Radius variable.
Save as Preset (Optional)
After styling the button with global variables, save it as a Preset by clicking on the Default Preset dropdown (top right corner) and choosing New Preset From Current Styles. For more details, please refer to our presets guide.
Now, every time you add a button, you can select this preset, and it will inherit all global styles.
Make a Global Change
Assuming that your brand color changes to
#FF5722
.Open the Variable Manager, and update the Color variable called Primary Brand Color.
Instantly, all buttons using that variable update across the entire site - no manual edits are needed.
Using this approach, you can create awesome Design Systems that can be updated from a single place. This is especially useful for clients who may rebrand or for maintaining consistency across large-scale designs.