Page templates

A template is one design that the storefront fills with many different things: each product, each category or each page you write in the admin. You change the template once and every page follows.

Where: The Pages tab in the designer, the Templates group.

#Three templates

Click a template to open it on the canvas, like Home. The TEMPLATE badge shows that the row is a template. A template's sections are the same on every page it draws.

The groups in the Pages tab are described under Sections and pages.

#Locked sections

Some sections belong to the template and cannot be removed. They have a lock and the ALWAYS ON badge instead of ON/OFF.

The ⋯ Actions menu and the toolbar on the canvas show only what is possible. If a locked section is missing from a saved template, the storefront puts it back. A locked section shows on every screen, so it has no Show on.

#The product page

Pages › Product page starts with these sections, in this order:

An empty Heading shows the platform's text in the visitor's language, for example "Details". Properties, Details, Reviews, Linked categories and You may also like can be switched off, moved and removed. A removed section is in the library under This page and can be added back. Without Reviews, the rating under the product name is not a link.

These sections also have Width and Show on under Layout. You may also like and each row of Linked categories have 4 columns on a computer, 3 on a tablet and 2 on a mobile until you choose others. Under the name of a template's section the inspector says where it can be: Only on product pages or Only on text pages.

Sections of your own from the library, for example Image + text or FAQ, can go anywhere below Product. Specifications is also under This page. With it on the page, the property rows stand in a section of their own with its own Heading, and Details shows only the text.

#The text in Details

Details shows the product's description. The first paragraph is not repeated there when it already stands by the price: when it is the Short description, or when there is no short description and the first paragraph fits by the price in full. A first paragraph that is cut short by the price stays in Details. With your own HTML for the buy panel the whole description stays in Details.

#The image beside Details

Image beside the text is None at the start. With Last image, the product's last picture shows beside the text. The picture shows on a computer only, from 1025 px. It does not change when the customer picks another variant.

#Properties and bars

The Properties section decides where the bars go. Which properties become bars, and their scale, is set per property under Products › Attributes.

Show bars under Components › Product page turns the bars on and off. With it off, the Bar properties are rows like the others. With the Properties section switched off or removed there are no bars either, and every property is a row in Details. The rows are in one place: in Specifications when it is on the page, otherwise in Properties as its own section, otherwise in Details. With the bars on, the same properties are not also rows. With your own HTML for the buy panel the platform draws no bars there, so the rows stay in the table. Properties as its own section is drawn by the platform, with your own HTML too. In the buy panel, the Show on of Properties applies to the bars, and Properties has no Heading, Width or Background: it draws no section of its own there.

#Text pages

Pages › Text pages has the Page text section with two settings:

Sections of your own can go below the text. You write the text under Admin › Pages, see Pages and legal texts.

#Collection pages

Pages › Collection pages draws the category pages, All products and the search results. The canvas shows the page as the storefront does: the name and the breadcrumb, the category's description, the filters, the bar with the number of products and the sorting, the products and the template's sections. On phones and tablets, up to 1024 px, the filters are the slim bar that opens a panel. Switch the canvas to Tablet or Mobile to see it.

The filters and the sorting work on the canvas, so you can tick, fold and open the panel to try them. Nothing you tick is saved. A click on a section selects it, as on other pages.

The look of the filters and the sorting is set under Components › Collection page. Which filters a category shows is set on the category.

#Preview with

The Preview with list above the canvas picks what fills the template while you work.

• Product page: first the most complete products, with the most pictures, properties and variants. Then one product from each category, and last all products. Bars and rows come from the product. You may also like shows other products of the storefront, not the product's own. Linked categories shows a sample row: the storefront's first category over its first products. A line above it on the canvas says it is a sample. Products sold only as an add-on come last, in their own group Sold only as an add-on.
• Search products… beside the list finds a product by its name.
• Text pages: the storefront's pages, the longest first.
• Collection pages: a category, All products or Search results. It starts on the category with the most filters, or on All products when the storefront has no categories. The list shows how many filters each category has. A category brings its own products, in their order in the category as on the storefront, its filters and its description. For Search results you type the words, and the canvas matches them on the product names.
• The choice is not saved with the template. It lasts in the tab until you close it.

The Product page and Gallery components show the same product, with the sections in the order you saved. The Collection page component shows the same choice as the Collection pages.

#Header and footer

The cog on a template in the Pages tab opens Header and Footer for every page the template draws. The change applies in the storefront at once, not at the next publish. Each product, category and page has its own address, title and search text.

#One choice, one place