New: Kinetic, our first Shopify theme. See it in action

How to Create a Custom Product Template in Shopify

Create a custom Shopify product template in the theme editor, design it for your hero products, assign it in the admin, and fix the common problems.

How to Create a Custom Product Template in Shopify

Your best-seller deserves a long page with a video, comparison chart and FAQ, while your accessories only need a photo, a price and an add-to-cart button. By default, though, every Shopify product uses the same product page layout. Change it for one product and you change it for all of them.

The fix is built into Shopify: alternate templates. You create a second (or third) product template in the theme editor, design it differently, and then choose which products use it. No app and no code are needed on a current Shopify theme. This guide walks through the whole process for products, and shows how the same steps work for collections and pages.

How Shopify templates work

Diagram of a Shopify alternate product template: copy the default, edit sections, assign to products, storefront shows the new layout
Copy a template, change it, then point the products that need it to the new layout

A template controls the layout of one type of page: the product page, the collection page, a regular page, a blog post. On Online Store 2.0 themes (Shopify’s current theme architecture, used by Dawn and most themes released in recent years), templates are made of sections and blocks you arrange in the theme editor.

Every theme has a default product template. When you create an alternate template, Shopify copies an existing template as a starting point. You then change sections in the copy without touching the original. Finally, each product points to whichever template it should use through its Theme template setting in the Shopify admin.

You can create alternate templates for products, collections, pages, blogs and blog posts, up to 1,000 templates per theme, which is far more than any store needs.

Before you start

  • Use an Online Store 2.0 theme. Creating templates in the theme editor requires a compatible theme. If you do not see a Create template option in the steps below, your theme is probably an older (“vintage”) theme.
  • Work on a copy of your live theme if the change is large. In Online Store > Themes, use the theme’s menu to Duplicate it, build the template there, then publish when ready.
  • Plan which products need it. Typical cases: a hero product, products sold as bundles, digital products without shipping details, pre-order items, or a seasonal range.

Step 1: create the new product template

Six steps to create and assign a custom Shopify product template
Everything happens in the theme editor and the product admin
  1. In your Shopify admin, go to Online Store > Themes and click Customize on the theme you want to edit.
  2. At the top of the theme editor, open the page selector. It shows Home page when the editor opens.
  3. Choose Products, then Create template.
  4. In the dialog, enter a Name that describes the layout, for example hero-product or bundle. Names are internal, so make them clear for whoever edits the store next.
  5. In Based on, choose the template to copy, usually your Default product template.
  6. Click Create template. The editor opens the new template, already filled with the sections of the template you copied.

Step 2: design the template

You are now editing only the new template. Changes here do not affect the default product page. A few ideas that work well for a hero product:

  • Add a video or image with text section below the main product section to show the product in use.
  • Add a collapsible content (FAQ) section answering the questions customers email you about.
  • Use a multicolumn section for three or four key benefits with icons.
  • Remove sections that distract, such as a generic “You may also like” row, if you want customers to stay on this product.

For a simple accessory template, go the other way: remove extra sections so the price and add-to-cart button sit high on the page, especially on mobile. Section names vary by theme, so look for the closest match in your theme’s Add section list.

While you design, the editor previews the template with one of your products. Use the product picker in the editor’s preview to switch to a product that will actually use this template, so you design with real photos and description length. Click Save when you are done.

Step 3: assign the template to products

  1. In the Shopify admin, go to Products and open a product that should use the new layout.
  2. Find the Theme template setting on the product page.
  3. Choose your new template from the dropdown.
  4. Click Save.

Repeat for each product. Open the product on your storefront to check the result, both on desktop and on a phone. Products you do not change keep using the default template.

The same steps for collections and pages

Where to assign Shopify product, collection and page templates in the admin
Every template type is assigned through a Theme template setting

Alternate templates are not only for products:

  • Collections: create a template under Collections in the theme editor, then assign it in Products > Collections, open the collection and use its Theme template setting. Useful for a sale collection with a banner and countdown, or a lookbook-style collection.
  • Pages: create a template under Pages, then assign it in Online Store > Pages through the Theme template dropdown in the page’s Online store section. Ideal for an About page, a size guide or a wholesale page with its own layout.
  • Blog posts: assign templates through the Theme template dropdown in the blog post’s Online store section, for example a recipe or lookbook layout.

Where page builders fit in

The theme editor is enough for many alternate templates. A page builder app such as PageFly or GemPages becomes useful when you want a layout your theme’s sections cannot produce: custom grids, advanced product galleries, sticky add-to-cart bars, or a page that matches a campaign design exactly. Page builders publish and assign their pages from inside the app, so follow the builder’s own documentation for that step, then check the product on the storefront as usual. We compared both approaches in page builder apps vs the native theme editor, and our page builder comparison covers the main options.

If you prefer to start from a finished design, our templates give you complete pages to adapt. Audify Premium is a multipage template for electronics and headphone stores with layouts suited to hero products, and Taspicify, built with PageFly, fits food and spice shops with many smaller products.

Four template ideas worth building

Not sure where to start? These layouts solve common problems for small stores, and each is a single alternate template:

  • Hero product. A long page for the one or two products that bring most of your revenue: a benefits row near the top, a video, customer photos, a comparison table against alternatives and an FAQ. Everything a hesitant buyer needs, without leaving the page.
  • Pre-order. A version of your product page with a clear message near the price explaining when the item ships, and a short FAQ about pre-orders. Customers who know the timeline up front send far fewer “where is my order” emails.
  • Digital or gift card product. Remove shipping and returns blocks that do not apply, and add a short “how you receive it” section instead.
  • Bundle or set. Show what is inside the bundle with an image-with-text section for each item, and how much the customer saves compared with buying separately.

Build one, assign it to a few products, and watch your product analytics for those items before rolling it out further. A layout that works for a hero product can feel too long for a low-priced accessory, so keep the simple default template for the rest of the range.

Renaming, deleting and finding templates

Shopify theme templates folder with default and alternate product template JSON files
Rename or delete templates from Edit code > templates

The theme editor creates templates but does not rename or delete them. Both are done in the theme’s code files:

  1. In Online Store > Themes, open the theme’s menu and choose Edit code.
  2. Open the templates folder. Product templates are named like product.json (the default) and product.hero-product.json (your alternate).
  3. Right-click a template file to rename or delete it.

Before deleting a template, switch every product that uses it back to the default template. It is also worth noting the file names you create, because a theme update or a switch to another theme does not carry your alternate templates across automatically; you would recreate them in the new theme.

Common problems and fixes

There is no “Create template” option

Your theme does not support creating templates in the editor, usually because it is an older theme. Consider moving to an Online Store 2.0 theme, or ask the theme developer how its templates are managed.

The new template does not appear in the product’s Theme template list

Templates belong to a theme. If you created the template in a duplicate or unpublished theme, the admin only offers it after that theme is published. Publish the theme, or create the template in the live theme.

My product still shows the old layout

Check that you saved both the template in the theme editor and the product in the admin, then reload the product page. If you edited a duplicate theme, remember the live store uses the published theme.

Changes to the template changed other products too

Every product assigned to a template shares it. If two groups of products need different layouts, create two templates. Sections that are set up as shared (for example a header or footer group) also change everywhere by design.

The layout looks wrong on mobile

Switch the theme editor preview to mobile and check each section. Long text blocks and wide image rows are the usual culprits. Our explainer on Shopify product options and variants is also worth reading if your template shows many option buttons.

Wrapping up

Create the template from the theme editor’s page selector, base it on your default product template, design it for the products that need it, and assign it with each product’s Theme template setting. Start with one hero product, compare how it performs with the rest of your range over a few weeks, and roll the layout out further if it works. For more detail, see Shopify’s help pages on creating and assigning templates and on sections and blocks.