Loading...
Area: Optimizely B2B Commerce

Layouts in Classic

Recommended reading 

Overview

Layout Templates provide an html structure that wraps around the rendered header, footer and page. By default the template named "Standard.liquid" will be used. A theme may contain any number of layout templates. In order to render a different template the LayoutTemplate property in theme.json needs to be modified. The html for the current layout template will be rendered using DotLiquid and then injected into the _mainLayout.cshtml file. The _mainLayout.cshtml file has been moved out of the theme directory to clearly indicate that it is not customizable. Layout Sections are a way to inject content into _mainLayout.cshtml.

DotLiquid Model

The model used for layout templates contains just a few properties. It does not have access to the current page because the site is a single page application. Nothing page specific should be included in the layout.

Property Type Value
Body string The rendered HTML for the page that is being requested
Footer string The rendered HTML for the footer
Header string The rendered HTML for the header
IsFooter boolean Used to indicate if the Footer is the current page being requested. This will generally only be true when CMS is being used to view/edit the Footer
IsHeader boolean Used to indicate if the Header is the current page being requested. This will generally only be true when CMS is being used to view/edit the Header

Upgrading

Existing Themes Without Layout Templates

In order to maintain backwards compatibility for git themes - if a theme is loaded and it contains no layout templates then the layout templates from the responsive theme will be automatically loaded into it at start up. These layout templates will only exist in the database, the git theme itself is not modified.

If a git theme is then modified to include at least one layout template then those responsive layout templates will be removed from the theme at start up. This means that it is important to include the LayoutTemplate defined in your theme.json, or one named standard.liquid if your theme.json file does not contain the LayoutTemplate property.

Do you find this information helpful? Please log in to provide feedback.

Last updated: Dec 11, 2020

Recommended reading