How to Edit Pages Using Divi’s Visual Builder

By Meredith Fennema

August 31, 2022

What is the Divi Visual Builder?

The Divi visual builder is a drag and drop builder that allows website owners to design and customize every part of a website from the ground up. We like Divi because of its ease of use for long-term editing.

While most clients ask us to manage website updates after launch, some prefer to manage this themselves. This blog post is designed to walk you through the most important things to know about editing pages that use Divi’s visual builder after launch.

Divi’s Building Blocks

If we’ve included the Divi builder on your website there are three main building blocks in use: Sections, Rows and Modules.

Sections are the most basic and largest building blocks used in designing layouts with Divi.

Rows sit inside of sections and you can place any number of rows inside a section. There are many different column types to choose from. Once you define a column structure for your row, you can then place modules into a desired column.

Modules are the content elements that make up your website. Every module that Divi has can fit into any column width and they are all fully responsive.

While in the visual builder you’ll see a blue outline when hovering over a section, a green outline when hovering over a row, and a black outline when hovering over a module.

While hovering, sections = blue, rows = green, modules = black

Editing Pages with the Divi Visual Builder

Step 1: Log Into Website

For more, please see instructions in the article “How to Log In to WordPress Website

Step 2: Navigate to Page

Option A)

Part 1: Pages > All pages

Navigate to pages from Dashboard

Part 2: Find page you want to edit, hover over it, press “Edit with Divi”

Edit with Divi from Pages area

Option B)

Alternatively, when you are logged in to your WordPress dashboard, you can navigate to any page on the front-end of your website and click the “Enable Visual Builder” button in the WordPress admin bar to launch the visual builder.

Enable visual builder from frontend of website

Step 3: Edit Modules in Visual Builder

In the visual builder, you can hover over what you want to edit, click on it, and it will give you options for editing. You should primarily edit in the “Content” tab (editing the design tab can make your web design look messy).

See below for links that include details about each type of module that can be edited.

How to edit text with Divi

How to edit a Divi slider

How to edit Divi image modules

How to edit Divi accordions

How to edit Divi’s fullwidth headers

How to edit buttons

When you are done editing a module, click on the green check mark at bottom right side of module to save module changes.

Save Divi module changes

Looking to edit a module not listed above? Divi’s full set of module documentation can be found at

Step 4: Save Changes

Save your edits by pressing the purple dots at bottom of page > Save

Purple dots
Save button

Exit Visual Builder by clicking “Exit Visual Builder” at top of page.

Ready to Connect?

Call: (616) 822-3706

About Meredith Fennema

Meredith manages web design and digital strategy services for Simpler Site. Clients across the country appreciate Meredith’s commitment to growth, generosity and kindness, alongside Simpler’s practical, make-it-happen approach. Meredith studied Human Centered Design at Kendall College of Art and Design, earned her Foundations in Design Thinking and Designing Strategy certificates from IDEO U, and has a Bachelor’s Degree in Business Communications and Political Science from Calvin University. In business and in life, Meredith believes in the power of embracing the unknown. Outside work she practices this while mountain biking, backpacking, cooking, and vegetable gardening.

You might also be interested in…

Four Pillars of SEO: Keywords for Relevance

In the last post from our Four Pillars of SEO series, we discussed the importance of relevance for search engines and how keywords play a large role in helping search engines know what your website/webpage is about.   The next question you should be asking is “what keywords should I use...

Four Pillars of SEO: Backlinks

In our previous blog post about SEO’s four main pillars, we discussed the importance of backlinks for SEO.  Having other websites link to your website demonstrates to search engines that your website is trustworthy.  Getting other websites to link to your website can be challenging, but...

Four Pillars of SEO: Authority

In our “Four Pillars of SEO” series we have been covering the main concepts used by search engines to decide how to rank websites in organic search. The first pillar was about relevance, and we also looked at how keywords affect relevance. The second pillar was about crawlability and making sure...

SEO Office Hours – December 2021

For the month of December, we attended and are overviewing in this post English Google SEO office-hours from December 31, 2021.  Refer to the Google SEO Office Hours blog series post overview for more information on Google SEO office hours. And, as always, if you’re looking to improve your...