Overview

This module allow site builders to select from a list of styles to apply to layout builder blocks and layout builder sections.

Screenshot of applying a style to a Layout Builder block component

A "style" is just a representation of one or more CSS classes that will be applied. Additionally, for blocks, a block template suggestion is added for the selected style.

Screenshot of defining CSS classes in Layout Builder Styles configuration

Styles can be grouped, allowing site builders to select one or more styles from each group. For example, you could have a group called "Padding" which a few styles that affect the amount of padding around a block. An additional group "Color Scheme" can be added to allow site builders to choose between multiple color styling options for a block.

Features

  • Create multiple style "groups", allowing site builders to select a style from each group for the same block or section.
  • Enforce a selection of no more than 1 style, or allow any number of styles to be selected.
  • Optionally restrict styles to only be available on specific block types and section layout types.
  • Styles and style groups are config entities and can therefore be exported/imported as any other configuration.

Limitations

For sections, there's currently a requirement that the layout plugins available on your site already have a configuration form associated with them. This module alters that config form to add the style selection dropdown. See this guide for more information on how you can create your own layout plugins that have a configuration form.

Documentation

Please refer to the documentation for more information how to use this module.

Versions

The 8.x-1.x branch is compatible with Drupal 9 only. It is no longer maintained.
The 2.0.x branch is compatible with Drupal 9 and Drupal 10 and is actively maintained.

Version 8.x-1.0 and 2.0.0 are otherwise identical in terms of features. All site owners should upgrade to a 2.0.x version.

Related Modules

Supporting organizations: 
Maintenance & Support
Maintenance & Support

Project information

Releases