The Divi Layout Block

The Divi Layout Block allows you to load Divi layouts right inside the Gutenberg editor.

Vlad avatar
Written by Vlad
Updated over a week ago

(click on the image to see the full size)

The Divi Layout Block

The Divi Layout block is a Gutenberg block that allows you to insert or create Divi layouts from scratch right inside the Gutenberg editor. This block can be used in combination with other Gutenberg blocks to build large complex layouts using the power of both editors.

Before getting started you need to make sure that Gutenberg is not disabled on your WordPress installation. If you have the Classic Editor plugin enabled, disable it and also head out to Divi > Theme Options > Builder > Advanced and ensure the Enable Classic Editor option is disabled.

(click on the image to see the full size)

To add a Divi Layout block, simply open an existing Gutenberg page or create a new one and from within the Gutenberg editor use the "Add Block" button and select the Divi Layout block.

(click on the image to see the full size)

Alternatively, you can also use the Divi Layout shortcut button in the editor.

(click on the image to see the full size)

When the Divi Layout block is inserted you will be presented with two options:

Build New Layout

This will open a popup with the Divi Builder and allow you to create a layout from scratch.

(click on the image to see the full size)

Load From Library

This will open the Divi Library modal and allow you to load a Divi layout directly. 

(click on the image to see the full size)

Once the Divi Layout block has been added you can edit its content by selecting the block and clicking on the "Edit Layout" button which will open a popup with the Divi Builder. 

(click on the image to see the full size)

Stay tuned for more cool features coming your way! ❤️

Did this answer your question?