Layout Builder + Introduction

Last updated on
7 February 2024

The Layout Builder + module is a powerful drop in replacement for the Layout Builder UI. Layout Builder + provides all the features expected from a modern day page builder while retaining Drupals openness and methodology for creating user interfaces.

Use case

The primary use case of this module is to provide users with a comprehensive page builder experience. 

Goals

  • Low barrier to entry
  • Design and edit in place
  • Easy and fast to build pages

Layout Builder + Umami Demo

The Layout Builder + demo module offers a hassle-free way to explore and showcase the capabilities of Layout Builder +. Whether you're evaluating its features or demonstrating its potential, this module provides a convenient setup for getting started.

Installing the Layout Builder + Module

  1. If your site is managed via Composer, use Composer to download the lb_plus module running composer require drupal/lb_plus drupal/field_sample_value. Otherwise copy/upload the lb_plus module to the modules directory of your Drupal installation.

  2. Enable the 'Layout Builder Plus' module and desired sub-modules in 'Extend'. (/admin/modules)

  3. Set up user permissions. (/admin/people/permissions#module-lb_plus)

  4. Choose your UI colors (optional). (/admin/config/content/layout-builder-plus)

Enable the Layout Builder + UI for a Content Type

  1. Navigate Structure > Content Types > Manage Display on a Content Type. (/admin/structure/types/manage/page/display)

  2. Check "Use Layout builder"  

  3. Check "Allow each content item to have its layout customized"

  4. Click Save

  5. Configure a default layout section (One column)

  6. Promote some blocks (Basic and Layout)

  7. (Optional) Manage Layout and remove all sections which will give users a blank page to start with

Enable Nested Layouts

  1. Navigate Structure > Block Types > Add block type (/admin/structure/block-content)

  2. Call it a "Layout Block"

  3. Remove the body field

  4. Manage the display

  5. Check "Use Layout builder"

  6. Check "Allow each content item to have its layout customized"

  7. Click Save

  8. Configure a default layout section (One column)

  9. Promote some blocks (Basic and Layout)

  10. Promote this new Layout Block on your content types by navigating Structure > Content Types > Manage Display on a Content Type. (/admin/structure/types/manage/page/display)

Help improve this page

Page status: No known problems

You can: