The Layout Builder Module Joins Drupal Core: Go From Site Builder to Site... Architect!

In Drupal world, it's not just spring that we're looking forward to... springing these days, but Drupal 8.5.0 (scheduled for the 7th of March), as well. Why? Cause starting then we, site builders, get spoiled with layout creating capabilities right out of the box. The once highly promising, yet still experimental, Layout Builder module, gets incorporated into Drupal core!

And what's in it for you? How does this integration impact your builds in Drupal?

Just imagine a “world” where you:

  • get to unleash all your creativity for customizing your content's layout to your liking
  • WITHOUT having to tap into a whole bundle of contributed modules for this
  • get to practically create a unique layout for each and every section by choosing from the predefined ones at and then mixing and matching blocks and other layout elements to your liking; a custom layout for every single content type, not just every page on your site;
  • … and to have your content custom layout displayed on every page on your website where these specific sections are shown, thus building visual consistency across your site, as well, along with uniqueness

So, after this imagination game, let's dig deeper into the implications of this “news”: how will “integrating” the Layout Builder” into Drupal 8 core impact you, the Drupal site builder?

And how can you get the most of this out-of-the-box layout managing functionality?

 

1. From Initiative, to Expertiment(al) to... a Stable Module in Drupal Core 

It all started as a spark of an idea, an initiative to inject flexibility (that Drupal's built a reputation for) into the process of designing pages in Drupal.

Then it grew into an experimental module, included in the Drupal 8.5.0 alpha version. And in about one week's time, the Layout initiative is scheduled to turn stable and level up to “Drupal core material”.

A story of success we could say.

Or better said, a vision turned into a handy solution. Dries Buytaert's vision, stemmed from a growing need/expectation coming from within the Drupal community: site builders craved out-of-the box layout managing capabilities!

The solution? The Layout Builder module in Drupal core, granting site builders that level of flexibility through an easy-to-use tool for designing pages with Drupal. 

A much-needed tool for quickly building new pages and choosing/changing/customizing their content layouts with great ease.

 

2. The Layout Builder Module vs a Bundle of Contributed Modules

Let's try a “before and after” sort of game. Let's see how layout management used to be handled in Drupal traditionally:

You had a two-solution method at hand; 2 contributed modules were needed to get the job done: the Panelizer and the Panels module.

Then, the “layout family” started to grow bigger. Starting with Drupal 8.3, the Layout Discovery module “joined the gang”!

And its impact was more than significant, since it added a Layout API to Drupal 8, removing the need for fragmentation and enhancing collaboration.

There's more:

  • the Layout Library, a contributed module, which is basically a collection of configurable layouts
  • the Field Layout, an experimental module enabling you to create unique layouts for each and every “entity display”; for each type of content that might show on a page or on multiple pages across the website

And we can't leave out this post's “focus Drupal tool” itself: the Layout Builder module!

 

3. How Does It Work? How Does It Empower You Precisely?

It turns you from “just” a site builder into a site... architect!

Meaning that the module:

enables you to build and to edit custom content layouts for multiple sections (or “entity displays”, if you prefer) on your Drupal site

Basically, you get to choose out of a collection of predefined layouts, then to customize the selected one(s) to your liking: swap elements, add blocks, manage the display etc.

Designing your pages in Drupal, creating your builds, will start to resemble more and more a Lego set assembling, mixing and matching. And this can't but add a new layer of flexibility to Drupal!

 

4. Getting Started: A Step-by-Step Guide to Using the Layout Builder Module

Enough with the praising of this module's out-of-the-box layout creating & editing capabilities and user empowerment functionality.

Let's talk facts!

Let's see how precisely you get to create, to customize your content layout on your Drupal site using this module:

 

  1. Needless to add that the very first step to take is to actually... enable it, along with the Layout Discovery module; next, install and enable the Layout Library module, too

     
  2. In no time, you'll spot the first “intriguing” difference: the familiar “Manage display” tab (admin/structure/types/manage/your-content-type-name*/display/default), along with all its fields, will have been replaced with a new button instead, called “Manage layout”

     
  3. No need to “panic”, for you'll see it displayed, but in a different format, within just a few steps

     
  4. Click on the “Manage layout” button and access the target content type's layout page: admin/structure/types/manage/your-content-type-name*/display-layout/default

     
  5. Once there, click “quick edit”; can you see the “remove” and “configure” options flanking each block? Well, take this window as the one replacing the old “Manage display” screen and do your layout customization work in here!

     
  6. It's here that you get to select out of all the predefined layouts that the Layout Builder module comes “packed” with; just click the “Add section” button!

     
  7. Once you've chosen your layout, go ahead and add its blocks: click the “Add block” buttons. 

     
  8. Mix and match those layout elements to your liking and feel free to change your mind, too, by making use of the “Cancel layout” button

     
  9. It's on that same “Manage display” tab, associated with your target content type, that you can check the option to create a unique layout for every content item; to customize them individually

     
  10. This will trigger the “Layout” button to join the group of buttons displayed on top of your target piece of content: “View”, “Delete”, “Edit”

     

The END! Having the Layout Builder module in Drupal core comes to break all the limits you've had to just accept, so far, as a Drupal site builder.

... all those challenges you had to face whenever you dealt with page design and, implicitly, with the creation and management of your layout(s). 

Starting March 7:

  1. you'll have your reliable built-in tool for easily creating your visually-appealing layouts
  2. you'll get empowered to go even further and have content items on your website individually customized

Now that's Drupal flexibility and user empowerment in 2 of their purest forms!