Layout Builder
With Layout Builder, administrators and users with access can create reusable page layouts (similar to templates) using a drag and drop interface. When launched, content editors use these layouts to create pages.
Create layouts from small pieces of reusable content—frames, tiles, and components.
Frames are containers that help you structure your page.
Tiles are blocks of content.
Make any component available to use in layouts by adding a "layouts" tag.
Easy as 1, 2, 3, and 4
- Place frames.
- Drag and drop prebuilt tiles.
- Configure styles, including fonts, colors, and more.
- Use the layout as a template when creating new pages.
Get startedLink to this section
Enable Layout Builder and access for your account
Administrators, make layouts available for all sites in your account.
- Go to Setup > Account > Optional Features.
- Select the Layout Builder checkbox.
- If not already selected.
- Click Configure to assign group access.
- Grant access to Builder for users who will create and edit the layouts that are used to create pages.
- Grant access to Tiles and Frames for users who will create and edit the tiles and frames used to create layouts.
- Grant access to Styles for users who will edit the CSS used by layouts.
- Grant access to JavaScript References for users who will create and manage the use of JavaScript in tiles.
- Click Save.
- In account setup, click Save.
Once enabled, you can restrict individual layouts to a site(s).
Customize Layout Builder settings
Layout Builder will add a disabled folder to your site that will publish supporting files to your production server. The folder is named /omni-cms
by default.
You can change the publish folder and the file extension for pages published from Layout Builder in Setup > Sites > Layout Builder Settings.
Create your default styles
Create the default CSS file that your layouts will use to create pages. Generating CSS will add a disabled folder (named /omni-cms
by default) to your site in Content > Pages. This folder will publish to your production server and will be logged as an action taken by "System."
- Go to Content > Layout Builder.
- In the Style Configuration box, click to Generate CSS.
- To edit the default CSS go to the Layout Builder panel, click Styles.
Create a layoutLink to this section
To get up and running quickly, drag and drop the prebuilt tiles, frames, and components to create a page layout that content editors can use to create pages.
- Go to Content > Layout Builder.
- Click +New.
- Type to enter a name for your layout.
- Click Create.
- From the sidebar, drag frames, tiles, and components and drop them in the layout editor.
- Make a component available for use in layouts by adding a tag named "layouts" to the component properties.
- Once added to a layout, you can nest, reorder, and resize the frames.
- Save and Launch to make layouts available for creating pages.
You can customize layouts to fit your needs by adding thumbnails, editing the head code, creating new tiles and frames, and more. You can manage the flexible layout options to create the right type of page for your website.
Use layouts to create pages