- Getting Started
- Liquid reference
- Filters reference
- Tags reference
- Localization
- Theme structure
- Theme sections
- Theme assets
- Theme config
- Theme layout
- Theme templates
-
- article.liquid
- blog.liquid
- cart.liquid
- collection.liquid
- customer/account.liquid
- customer/addresses.liquid
- customer/details.liquid
- customer/login.liquid
- customer/order.liquid
- customer/register.liquid
- customer/reset-password.liquid
- home.liquid
- page.no-heading.liquid
- products.liquid
- search.liquid
- list-collections.liquid
- store-locator.liquid
- 404.liquid
- customer/activate_account.liquid
- customer/orders.liquid
- Submission
Theme layout
Layout files are very important for your theme because every other template file is rendered inside the active layout. There is only ever one active layout on your store at any given time. The active layout changes when your online visitors begin the checkout process.
theme.liquid
theme.liquid is the default active layout when visitor browsing your online store. It usually renders the header content, footer content, navigation, and other global variables.
Every layout must include two required objects so that EasyStore can inject platform assets and render each template's content:
content_for_header
The content_for_header object injects the scripts and meta tags that EasyStore requires to run correctly, such as analytics, app scripts, and platform features. It must appear inside the <head> element of your layout, and should be placed as close as possible to the closing </head> tag.
{{ content_for_header }}
content_for_layout
The content_for_layout object renders the content of the current template inside the layout. It must appear inside the <body> element, where you want each template's output to be displayed.
{{ content_for_layout }}
Minimal layout
A minimal theme.liquid layout wires both objects into a standard HTML document:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>{{ page_title }}</title>
{{ content_for_header }}
</head>
<body>
{{ content_for_layout }}
</body>
</html>
App extension points such as {% app_snippet 'global/head' %} may also appear in the layout, allowing installed apps to inject markup at defined positions. See the Tags reference for details.