Layout Builder

The layout builder lets editors compose reusable page layouts from containers, widgets, and widget assets.

This surface is provided by the optional capell-app/layout-builder package. Core owns pages, sites, URLs, and themes; the package owns layout containers, widget placement, content-first editing, public layout graph generation, and the Filament editor.

Install it with:

composer require capell-app/layout-builder
php artisan capell:layout-builder-install

Editor Modes

The default content_first mode groups editable content by its current layout placement and lets editors update titles, copy, logos, and assigned records without opening the full canvas.

The layout_first mode opens the drag/drop layout builder directly for users who need placement and structure control.

Responsive Editing

Use Desktop, Tablet, and Mobile preview controls to inspect a layout at each breakpoint. Resizing a container while a breakpoint is active stores an override for that breakpoint. If no override exists, the container falls back to its base column span.

Undo And Redo

Undo and redo apply to unsaved changes in the current editing session. Saving the layout clears the undo history and establishes the saved layout as the new baseline.

Outline

The outline lists containers and widgets in layout order. Use it to jump to large sections, search for widgets, and move items with the same mutation rules used by the canvas.

Copy, Paste, And Presets

Copy and paste duplicate safe layout fragments inside the current layout. Presets save selected containers as reusable fragments that can be inserted into other positions.

Diagnostics

Diagnostics warn about invalid responsive metadata, unknown widgets, missing asset targets, and other layout health problems. Blocking diagnostics must be resolved before saving.

Asset Scope

Widget assets can be global or page-specific. Global assets apply wherever the widget appears. Page-specific assets override global assets for the page being edited.