Layouts

Layouts are the base of the theme, through which all templates are rendered. Use the layout file to host repeated theme elements like headers and footers.

The default layout, which all themes must contain, is theme.liquid.

Layout files are hosted in the layout directory of theme.


Standard objects

There are two main Liquid objects to be included in layout files:

🚧

Caution

These objects are required in theme.liquid. If references to these objects aren't included, then you can't save or update the file using the code editor.

content_for_header

The content_for_header object outputs scripts from Shoplazza. You need to add a reference to this object between the <head> and </head> HTML tags.

<head>
  ...
  {{ content_for_header }}
  ...
</head>

You shouldn't try to modify or parse the content_for_header object. If content_for_header changes, then the behavior of your Liquid will change.

content_for_layout

The content_for_layout object dynamically outputs the content for each template. You need to add a reference to this object between the <body> and </body> HTML tags.

<body>
  ...
  {{ content_for_layout }}
  ...
</body>

Descendant selectors

You can help create CSS rules for specific templates by outputting data from the template object in the <body> tag’s class.

<body class="{{ template.name }}">
  ...
</body>

Did this page help you?