Additional modules

Last updated on
20 November 2024

In addition to the core Layout Builder and Layout Discovery modules in core, there are contributed Layout Builder ecosystem modules that you may want to use, including the following:

Layout Builder Components

  • Layout Builder Kit: Some components you can start using on your site or use as examples for your custom components. Please consider contributing your components back so that we can grow the library.
  • Layout Components: With this module we want to extend the user experience by creating an improved interface, much more customizable and with aspects that are essential for us, such as the live preview of the changes while editing the content.
  • Patternkit: Components are provided by your existing theme templates - just drop in a JSON file in schema format to allow editors to fill out and map the components, or download an existing Twig (or other frontend tech) library with JSON schema to be able to drag and drop those components on your layout.
  • Extra Block Types (EBT): A core enabler and links to a collection of separate modules to provide associated custom blocks. Everything from text, tiles and quotes, to countdowns, accordions and timelines. Comes with some helper modules including one to help you create your own custom blocks. Highly configurable with many layout and design options for each component. 

Layout Builder Extensions:

  • Bootstrap Layout Builder: Adds Grid support and graphical styling options to the Layout Builder module. Currently working in Bootstrap versions 3/4 & 5. Grid system is class based and can be replaced with another framework if desired. 
  • Layout Builder Blocks: Utilize Bootstrap Styles module plugins to add different styling options for layout builder blocks. For example: background, padding, margin, ...etc.
  • Grid Layout: Grid Layout is a simple module that provides a layout plugin that can dynamically define new regions using css grid template columns and areas.
  • CSS Grid Layout: This module leverages CSS Grid grid-template-columns and grid-template-rows properties to create dynamic layouts within the Layout Builder dialog.
  • Layout Builder Advanced Permissions: Provides more granular permissions for working with Layout Builder.
  • Layout Builder Asymmetric Translation: This module lets you have different layouts and blocks per language.
  • Layout Builder Backgrounds: This module provides the ability to add images, solid colors, and other unique backgrounds to any Layout Builder section.
  • Layout Builder Base: Allows site builders to create layouts by choosing multiple parameters such as background, padding, margin, columns, spacing etc... It can also provides a base for developers to create their own layouts.
  • Layout Builder Boolean: Lets you configure True/False versions of a Layout Builder section. You can configure which field operates as the "switch", deciding whether the True regions or False regions should render.
  • Layout Builder Browser: Enhances the layout builder block selection usability by adding images and custom groups.
  • Layout Builder Component Attributes: Allows editors to add HTML attributes (id, class, style, & data-*) to Layout Builder components (blocks).
  • Layout Builder Customizer: Allows the user to customize Layout Builder Options.
  • Layout Builder Direct Add: Replaces the "Add block" link with a drop-button that lists custom block types as links.
  • Layout Builder Everywhere: Allows site builders to edit additional block regions. It allows them to edit blocks in the header/footer/sidebar via Layout Builder UI.
  • Layout Builder Extra Templates: Adds extra, generic theme suggestions based on the name of the active theme. Provides suggestions for inline and custom blocks so you can have one template that applies to both.
  • Layout Builder Library: Allows content editors to pick from a list of pre-defined layouts.
  • Section Library: Create reusable templates for single or multiple sections.
  • Layout Builder Lock: Allows administrators to lock sections to disable editing/moving/deleting blocks in overrides.
  • Layout Builder Modal: This module lets you add and configure existing blocks in a modal in the Layout Builder UI.
  • Layout Builder Operation Link: Adds a 'Layout' operation link to Layout Builder-enabled content on Drupal administrative pages. This link saves content editors a click/page load when they want to access an entity's layout page directly without loading its edit page first.
  • Layout Builder Quick Add: Allows you to display a selection of block types when clicking "Add block" instead of opening the sidebar. You will still have a "See more blocks" link that will let users use the default drupal core workflow.
  • Layout Builder Restrictions: Set which blocks and which layouts should be available for placement in Layout Builder.
  • Layout Builder Save And Edit: This Module adds the "Save and Edit Layout" button in layout builder form page which will save Site Builders/Content Editors time by redirecting it to same page in which they can see their recently added changes and can add extra changes for their layout.
  • Layout Builder Styles: Select from a list of styles and apply to Layout Builder blocks and sections.
  • Layout Builder Symmetric Translations: Keep the same layout the between languages.
  • Layout Builder Tabs Section (sandbox): Provides a new layout to use as a section within layout builder. Any block added will have its title shown as a tab in the tab set, and clicking a tab will reveal the content for the appropriate block.
  • Layout Builder UX: Allows site builders to rename the layout builder labels for sections and fields. Will gain more interface improvements over time.
  • Layout Options: Provides a Layout plugin that allows configuration options to easily be added layouts using using Yaml files and LayoutOption plugins. In most cases, using no code, just YAML files.
  • Layout Section Classes: Allows you to define a list of classes and labels that will be available for selection on each section of a layout in layout builder.
  • Media Library Theme Reset: This module fixes theme related problems related to using Layout Builder in conjunction with the core Media Library. See also Layout Builder Modal Theme Reset.
  • Mini Layouts: Mini layouts allows administrators to define blocks that contain other blocks arranged using a layout. This is the spiritual successor to "Mini Panels".
  • Layout Builder Asset: This module allow site builders to add a CSS and to apply to layout builder blocks.This module is definitely not a replacement for theming, but it provides site administrators with a quick and easy way.
  • Layout BG: The BG stands for backgrounds! This module provides plugins for use with Layout Builder that make it extraordinarily easy to add background images to your layouts. There is single-column layout and a two-column layout. You can add a background to other layouts easily in most cases.
  • Layout Builder Widget: This module moves Layout Builder UI to an entity edit form.
  • Layout Builder IPE: Inspired by Panels IPE, this module provides a similar In-Place-Editing experience, allowing to make changes directly on the page without the need to navigate to the layout tab. The only solution so far for frontend editing and preview of Page Manager pages.
  • Layout Builder Reorder: This modules allows site builders to reorder layout sections inline.
  • Seeds Layouts: Seeds Layouts built to provide one column, two columns, and three columns layouts. You can add a custom option using a checkbox or select list and these options will be added as classes on your section. You can also upload a background image.
  • Varbase Layout Builder: Utilizing the Bootstrap Layout Builder module. Optimized for Varbase standard layouts and styling configurations. Having custom Layout options, and custom styling plugins.
  • Layout Builder Plus: A drop in replacement for the Layout Builder UI that improves the layout builder UX out of box. 

Layout Builder Admin Theme integrations

  • Layout Builder Claro: An opinionated attempt at making the transition between the Claro admin theme and a custom themes Layout Builder pages smoother. Includes a nice wide Off Canvas tray and themed Media Library.
  • Gin Layout Builder: Brings the gin admin theme to the layout builder

Block Integrations

  • Layout Builder Block: Provide a block plugin, allowing to place a simple formatted text as a Layout Builder component. The text is saved as component configuration which is stored into the layout storage. Everything is self-contained in Layout Builder.
  • Block List Override: Remove blocks either from the site-wide available blocks list, or from the Layout Builder available blocks list. Note: This module is the replacement for Block Blacklist module. Please use Block List Override now.
  • Block Form Alter: Altering block forms for Layout Builder is a pain. By providing hook_block_plugin_form_alter() and hook_block_type_form_alter(), Block Form Alter makes it easy.
  • Paragraph Blocks: With this module, you can use paragraphs to create structured content on your page, and allow layout builder to place each paragraph anywhere on the page.

Help improve this page

Page status: No known problems

You can: