Drupal Canvas (formerly Experience Builder)

Drupal Canvas is a module that lets editors build pages by placing components in a browser-based editor instead of filling in forms. It stores each layout as a component tree and renders it with Drupal. Site builders decide which components editors may use. On 26 October 2026 its newest release was 1.12.0.

How it works in Drupal 11

Canvas is visual first. An editor arranges components, then wires some of their inputs to Drupal data. The layout lives in a field type called a component tree: an ordered list in which each item says which component it is, which slot it sits in and what its inputs are.

The 1.12.0 documentation lists three kinds of component. Single Directory Components bring Twig, CSS and JavaScript. Block plugins bring existing blocks. Code components are JavaScript and CSS written and managed in Canvas, rendered with Preact.

An input can be a static value stored with the layout, or an entity field prop: the layout stores an instruction that fetches the value from the current node or another source when the page renders. Canvas only offers fields whose data matches the shape the component expects.

Three entity types matter. A Canvas page is a content entity with revisions, listed at /admin/content/pages and edited at /canvas/editor/canvas_page/{id}. A content template is a configuration entity that sets the layout for one entity type, bundle and view mode. Page templates define how pages are rendered. Canvas also ships submodules such as canvas_ai and canvas_headless.

Status when checked

The project page, checked on 26 October 2026, lists 1.12.0 as the latest release and states that stable releases are covered by the Drupal Security Team's advisory policy. Only the 1.12 and 1.11 branches are supported; older minor versions such as 1.10 no longer are, so plan to follow new minor releases. The 1.12.0 notes introduce Brand Kit, a central place for site colors and fonts, and a revised navigation bar for page editing.

Example

A developer adds a notice component to the theme. They open Appearance › Components (the /admin/appearance/component page) and check that the component is enabled. An editor then opens a Canvas page, drags the notice from the library into the layout and types its text. To fill an input from the content itself, a site builder maps a field of the article to that input in a content template.

Common mistakes

• Missing components. A Single Directory Component that does not meet Canvas's rules never shows in the library. Among those rules, Canvas requires a props schema, a title on each prop and slot, and an example value for each required prop. Appearance › Components has a tab for disabled and incompatible components.
• Handing out the code component permission. administer code components is restricted because code components execute JavaScript; give it only to people you trust with code.
• Assuming translation works through core. The 1.12.0 guide says the core Content Translation interface does not support translating Canvas content. It suggests TMGMT or the experimental Canvas Translate module.
• Expecting layouts to convert. Installing Canvas leaves existing pages as they are. The 1.12.0 components documentation says a migration from Layout Builder must remain possible, but that many details are still to be figured out.

For marketing and content teams

Canvas aims at people who build landing pages without a developer. You choose from the components that your site builders have made available, so pages stay within the approved design. The trade-off is that the component library is part of the project: a Canvas site needs a set of components, such as the Mercury theme or one built in house. Ask your team which release they run and who updates it, because the project moves in minor releases.

With DXPR

DXPR publishes a comparison of DXPR Builder and Drupal Canvas, checked on 24 September 2026. It describes DXPR Builder as visual composition inside a text field that has the builder enabled, supporting Drupal 10 and 11, and Canvas as composition with Single Directory Components and code components.

Sources

• Drupal.org: Drupal Canvas project page
• Drupal.org: Experience Builder project page (renamed)
• Drupal.org: Drupal Canvas 1.12.0 release notes
• Dries Buytaert: Drupal CMS 2.0 released
• Drupal Canvas 1.12.0: README
• Drupal Canvas 1.12.0: introduction for contributors
• Drupal Canvas 1.12.0: components documentation
• Drupal Canvas 1.12.0: translations guide
• Drupal Canvas 1.12.0: code components guide
• Drupal Canvas 1.12.0: AI assistant guide
• Drupal Canvas 1.12.0: module info file
• DXPR: DXPR Builder compared with Drupal Canvas