Skip to main content
Print
Table of Contents

Before we can import the settings, we need to enable Divi Builder. The most common method is acessing this through the Front Builder. 

When you view a page, you can enable the Divi Builder by clicking it on the menu bar above.

Screenshot of a WordPress website editor with an arrow pointing to the "Edit with Divi" button in the admin bar at the top of the page.

1. Importing Variable Manager File

The Variable Manager in Divi 5 is a central hub where you create and manage Global Design Tokens (like colors, fonts, and spacing) that can be used throughout your entire website. 

In simple terms, it’s like a "Cheat Sheet" of design rules that the whole site follows.

  • Go to the + icon on the left bar and find the Variable Manager
  • Click on the Portability Icon and choose Import
  • Import the file called Yourtheme All Variable.json from your Download Folder
  • Save Variables 
Screenshot of a website editor showing the customization panel on the left and a website preview on the right with a header reading "Executive Coaching for Leader.

2. Importing Preset Manager File

The Preset Manager in Divi 5 is a centralized tool that lets you save and control the styling of specific modules (like buttons, headings, or blurb icons) across your entire site. This is where you make changes that will apply to the whole site

  • Go to the + icon on the left bar and find the Preset Manager
  • Click on the Portability Icon and choose Import
  • Import the file called Yourtheme All Preset.json from your Download Folder
  • Save Variables 
Screenshot of a website template editor with a sidebar of elements on the left and a webpage preview on the right showing the heading "Executive Coaching for Leader.

That's it! Your website should now look like the Demo

It's time to personalise it to your branding.