Overview of regions from a theming perspective.
A layout can describe how various components are arranged on various levels--from an entire page from the header to the footer, to just the "middle" where the dynamic content goes, to individual components. It can apply to templates for managed content or one-off designs for landing pages.
The challenges with layouts include:
- How can I implement a certain design in Drupal?
- How can content editors manage the content and layout on a given page, especially for one-off pages with distinct layouts (e.g., landing pages)?
- What tools are available? What are the use cases for each solution and the advantages and disadvantages to each tool?
In Drupal core, tools include:
- Themes and regions
- Twig templates
- Display modes
- Layout API (>=8.3.x)
Contributed modules and themes that extend Drupal core:
- Panels, Page Manager, Panelizer
- Display Suite
- Block Visibility Groups
- Themes (Zen, Omega, Bootstrap) or other Grid Systems
Pure CSS-based solutions can be implemented via libraries and/or themes:
- CSS flexbox and grid
- Implement a design for a landing page
- Implement a design for a content type template
- Provide a way for content editors to assemble or edit complex pages that fit a design
As of Drupal 8.4.x, the Layout API or Layout Discovery module is a stable core module. (It was introduced in Drupal 8.3.x as an experimental module.) It replaces and is incompatible with the Layout Plugin module. Be sure to check that the minor version of Drupal core you are using is compatible with the contributed module(s) you want to use for layout solutions. Expect that many contributed modules will eventually use Layout Discovery (and some already do). There are many robust solutions already available and many more are emerging.
We are still filling out our Drupal 8 library and this page will be updated with new tutorials as they are created.