How To Download Page Templates Shopify

Templates

Templates control what's rendered on each type of folio in a theme.

Each page type in an online store has an associated template type. Y'all tin can utilise the template to add functionality that makes sense for the folio type. For example, you can add additional product recommendations to a product template, or add a annotate course to an article template.

You can create multiple versions of the aforementioned template type to create custom templates for different utilise cases. For example, you can create a separate product template for outerwear products, or a separate page template for pages with video content.

Templates control what's rendered on each type of page in a theme.

Template files are located in the templates directory of the theme:

Yous can utilize two different template file types in your theme. These template file types can exist used to build multiple template types, each of which represents a type of content in a merchant'due south online store.

There are ii dissimilar file types you tin can employ for a theme template: JSON and Liquid.

Some template types support only the Liquid file type, while other template types support either template file type.

Type Clarification

JSON

Type	Clarification
JSON	JSON templates are information files with the `.json` file extension. These templates let yous easily populate your template with content from sections. Sections can be added, removed, or rearranged past merchants using the theme editor. If yous're using a JSON template, then any HTML or Liquid code needs to exist included in a section that'south referenced past the template. To acquire more, refer to JSON templates.
Liquid	Liquid templates are Liquid markup files, with the `.liquid` file extension. You tin add Liquid and HTML directly to Liquid templates.

JSON templates are information files with the .json file extension. These templates let yous easily populate your template with content from sections. Sections can be added, removed, or rearranged past merchants using the theme editor.

If yous're using a JSON template, then any HTML or Liquid code needs to exist included in a section that'south referenced past the template.

To acquire more, refer to JSON templates.

Liquid Liquid templates are Liquid markup files, with the .liquid file extension. You tin add Liquid and HTML directly to Liquid templates.

If you lot desire to use sections in a template, then y'all should apply a JSON template.

JSON templates provide more than flexibility for merchants to add, remove, and reorder sections, including app sections. Additionally, they minimize the corporeality of information in settings_data.json. Instead, data is stored directly in the template, which improves the performance of the theme editor.

Each available template type represents a type of content in a merchant'south online store. No template types are required. However, you must take a matching template for any page type that you want to render. For example, to render a product page, you demand at least ane template of blazon product.

You lot can have a maximum of 1000 JSON templates in your theme, across all template types. For example, if y'all have 20 JSON production templates, 10 JSON folio templates, and 5 JSON collection templates, so y'all can add together upwardly to 965 additional templates to the theme.

You lot can utilise the following template types in your theme. To larn more about each template type, click on the template proper noun.

Blazon	Description
404	Renders page content that is shown to customers if they enter an invalid URL for the shop.
commodity	Renders the article page, which contains the full content of the article, as well as an optional comments department for customers. This template is used for items like private posts in a web log.
web log	Renders the blog folio, which lists all articles within a web log.
cart	Renders the `/cart` page, which provides an overview of the contents of a customer's cart.
collection	Renders the collection folio, which lists all products within a collection.
customers/business relationship	Renders the client account page, which provides an overview of the client'southward account.
customers/activate_account	Renders the client account activation page, which hosts the course for activating a customer account.
customers/addresses	Renders the customer addresses page, which allows customers to view and manage their current addresses, as well as add new ones.
customers/login	Renders the customer login folio, which hosts the form for logging into a customer account.
customers/order	Renders the customer order page, which displays the details of a customer's past orders.
customers/register	Renders the customer register page, which hosts the grade for customer account creation.
customers/reset_password	Renders the countersign reset page, which hosts the form to reset the password for a customer business relationship.
gift_card.liquid	Renders the gift carte du jour page, which displays the souvenir card issued to a customer upon purchase. This must exist a Liquid template.
index	Renders the home page of the store, located at the root URL (`/`).
list-collections	Renders the drove list folio, which lists all the store's collections. This folio is located at the `/collections` URL of the store.
page	Renders the shop'south pages, such as Most the states and Contact us.
password	Renders the `/countersign` page, which is a landing page shown when you add together countersign protection to your online store. This folio includes a message that is editable past merchants, and the password form for customers to proceeds access to the store.
product	Renders the production page, which contains a product'southward media and content, as well every bit a course for customers to select a variant and add it to the cart.
robots.txt.liquid	Renders the `robots.txt` file, which is hosted at the `/robots.txt` URL. This file tells search engines which pages can, or can't, be crawled on a site. This must be a Liquid template.
search	Renders the `/search` page, which displays the results of a storefront search.

A Liquid template doesn't have a fixed schema. Refer to Content for information about what yous can include in a Liquid template.

A JSON template accepts only a JSON file with a fixed schema and list of accepted attributes. For information virtually the schema of a JSON template, refer to JSON templates.

The content that you tin include in a template depends on whether it is a JSON template or a Liquid template.

Yous should ever keep the goal of the template type in heed when deciding what content you want to include in a template. For example, a product template, or a section in the product template, should e'er include the product object, which renders product details, and the production form tag, which lets customers add a product variant to the cart. Depending on your template type and approach, you might desire to include these items in a department that you reference in the template.

A Liquid template accepts standard HTML and Liquid. Liquid templates can admission any global Liquid objects, too every bit the object that'due south associated with the template. For more than information, refer to the documentation for each template type.

A JSON template accepts only JSON with a stock-still schema and list of accepted attributes. For more than information, refer to JSON templates.

When working with template files, you should familiarize yourself with alternate templates and how to use them.

In some cases, you might need to create different markup for the same template. For case, you might want to create an alternate template that includes unlike sections for specific products.

You tin create an alternate template locally, through the theme code editor, or through the theme editor.

Alternate template files use the following proper name construction, where template-proper noun is the template proper noun, template-suffix is the alternate name, and template-file-blazon is the file blazon, which is either json or liquid:

For example, if you create an alternate JSON product template with the proper noun of alternating, then the file proper noun would be the following:

After an alternating template has been created, information technology tin can be applied in the following ways:

It can exist assigned to an associated resource in the Shopify admin.
It can be previewed in the theme editor.
It can be rendered on the storefront with the view URL parameter.

Alternate templates can exist rendered on the storefront with the view URL parameter. This parameter should be in the format of ?view=[template-suffix], where [template-suffix] is the template's alternate name.

For example, given the product.alternate.json template from the previous section, and a product called Example product, you can render that product with that template using the following: