Editing hidden sections in Divi visual builder

In some Divi layouts or templates, specific sections are hidden on the frontend using custom CSS (usually with display: none;). While this is useful for controlling what appears on the live site, it can make those sections hard to edit in Visual Builder mode.

Problem

When using the Divi Visual Builder, you might notice that some sections or modules are not visible, even though they exist and appear when previewed or accessed through a different page/tab. This often happens because the section is set to display: none.

Solution: Temporarily enable visibility

To edit those hidden sections, follow these steps:

1. Enable Visual Builder on the page where the section is located.
2. Edit the code module
   • Edit display: none;
3. Temporarily change it to: display: block;
4. Edit the content.
5. Once done, revert the CSS back to:display: none;
6. Save the page.

Note

Use this method only when needed for editing. Keeping display: block; applied permanently may unintentionally show hidden elements on the live site.