Create a Flexible Layout for a Content Type

Enable Layout Builder and Layout Discovery modules

In the Manage administration menu, navigate to Extend (admin/extend), then select the Layout Builder and Layout Discovery modules from the list, and select Save to enable them.

Enable Layout Builder for a content type

We will enable Layout Builder for the Basic page content type.

In the Manage administration menu, navigate to Structure > Content Types (admin/structure/types), then select Manage Display from the options in the Basic page row.

While there’s no explicit restriction about what view mode to use with Layout Builder, the intended purpose for the Layout Builder module is to set up and manage layouts for pages. We recommend using either the Full content or Default view modes when setting up a layout.

On the Manage Display tab under the Custom Displays section you should see a new details block named Layout Options. In this block select Use Layout Builder. Leave Allow each content item to have its layout customized checkbox unchecked and select Save.

Note: We cover the configuration option Allow each content item to have its layout customized in the tutorial, Change the Layout on a Per-Page Basis.

Switch to Layout Builder UI for the Basic page content type

Once you’ve saved the configuration, you should see that all fields disappear and a Manage layout button appears.

When a view mode is set up to use Layout Builder, the appearance and placement of all fields is managed through the layout interface instead of the default Manage display interface. Select the Manage layout button to open the Layout Builder interface for the Basic page content type (admin/structure/types/manage/page/display/default/layout).

You should see the Layout Builder UI, and some help messages explaining the purpose and limitations of the UI.

By default, Layout Builder replicates the default Drupal behavior for this content type. It creates a one-column layout section and places fields that were displayed for the particular view mode inside it, matching the order that was in place prior to setting up Layout management for the view mode.