Visual Content Management

Content authors can struggle to map administrative forms with fields for structured content against the resulting rendered visual presentation of that content. While content managers do have tools such as preview, bouncing back and forth between a preview and editing adds effort for authors. This motivated a secondary authoring experience called Layout Builder, which offers visual content management. The feature helps provide content authors with rendered content as changes are made. Furthermore, it extends beyond just nodes by affording the same experience for rendered blocks.

In this chapter, we’re going to cover the following main topics:

• Blocks and custom block types
• Layout Builder
• Contributed projects

Blocks and custom block types

Beyond content types, Drupal offers a second fieldable content entity known as blocks. Where a content type renders as its page, a block can be rendered on one or more pages tied to a theme region.

Managing blocks

Out of the box, Drupal comes with many different blocks. Blocks help render menus, content in the header, content in the footer, and much more.

Block management can be found at admin/structure/block. The following figure shows the centralized management screen in Drupal:

Figure 15.1 – Central block management administrative screen

Figure 15.1 demonstrates block placement. There are tabs at the top for each enabled theme. A block can be placed by pressing the Place block button for the region of the theme. This button prompts a modal window that contains the entire block catalog. The modal also provides the option to create a custom block, if needed. Placed blocks can also be moved between regions...

Layout Builder

Structured content can be confusing for content authors. Ensuring that Drupal promotes usability and ease of use for content authors helps ensure a Drupal application can be adopted. Authors often struggle to understand how specific fields map to different, rendered visual presentations. Layout Builder attempts to provide a visual experience for content authors to see content change. This combined experience helps the author more directly and easily see how a change is displayed when the change is made.

Layout Builder stays with a layout. Think of this as a series of places on a page where the content can be rendered. From the perspective of structured content, each field in a node can be placed within the layout. Blocks rendered on a page can also be placed within a layout. This allows Layout Builder to author content beyond just the structured content on a page and from the experience of what is rendered, not just the underlying fields.

Placement has context...

Contributed projects

Several contributed modules exist on drupal.org that are complementary to the concepts in this chapter. Please note that the following projects are not necessarily recommended given that, in some circumstances, core maintains similar functionality.

Paragraphs

Paragraphs (https://www.drupal.org/project/paragraphs) is a vast ecosystem of modules based on a content structure similar to blocks. Its purpose was to offer an alternative content authoring experience to Drupal’s default block management. The Paragraph entity has a bundle called Paragraph Types. The community has developed several out-of-the-box contributed modules for paragraph types:

• https://www.drupal.org/project/ept_accordion – accordion
• https://www.drupal.org/project/ept_basic_button – a button
• https://www.drupal.org/project/ept_carousel – a carousel
• https://www.drupal.org/project/ept_image_gallery – an image gallery
• https://www.drupal...

Summary

Drupal has a core feature for visual content management called Layout Builder. Layout Builder leverages Drupal’s blocks feature, which offers structured content entities. Layout Builder provides a different content authoring experience beyond the default block management by adding a new concept of a layout that has a default layout managed per content type and the ability to manage layouts per node. This feature helps manage the presentation of rendered content within a specific region of a theme. This works for both system-wide blocks and custom block types. Node-specific layouts afford context where a block can be placed only on a node and not on a default layout, which would apply to all nodes using the default. Layout Builder offers site builders and content authors more control over where and how a specific field can be rendered but also adds block-specific content authoring within node-specific layouts. Drupal has other contributed solutions similar to Blocks and...