---
title: How to Create a Custom Product Template 
description: "Easily assign your new Configurator template to Shopify products using the app's \"Assign All\" feature or via individual product settings in one click."
---

[Skip to content](https://shopify-apps-kb.nsource.com/shopify-apps-kb/how-to-create-a-custom-product-template-0#main-content)

English

Show submenu for translations

![nst-dark-logo-250-1](https://shopify-apps-kb.nsource.com/hs-fs/hubfs/nst-dark-logo-250-1.png?width=250&height=65&name=nst-dark-logo-250-1.png)

Open main navigation

Close main navigation

- English
  
  Show submenu for translations
- Contact us

 Contact us

 How can we help you?

- There are no suggestions because the search field is empty.

1. [NetSource Shopify Apps](https://shopify-apps-kb.nsource.com/shopify-apps-kb?hsLang=en)
2. [Configurator](https://shopify-apps-kb.nsource.com/shopify-apps-kb/configurator?hsLang=en)
3. [Settings](https://shopify-apps-kb.nsource.com/shopify-apps-kb/configurator?hsLang=en#settings)

# How to Create a Custom Product Template 

## By default, every product in your Shopify store uses the same product page layout. For configurable products, you usually want something different — a layout that hides the default variant picker and add-to-cart button (since the configurator handles those itself) and gives the configurator block full control of the page. A dedicated product template is how you do this.

This guide walks you through enabling the Configurator app embed in your theme, copying the Template JSON from the Configurator app, and creating a custom product template in your theme code.

> Prefer to watch instead of read? [See the video walkthrough](https://youtu.be/NwGpcdvcA6U).

#### What you'll need

- Admin access to your store's theme settings
- A few minutes in Shopify's theme code editor — no special tools required
- At least one configurable product already set up in the Configurator app

#### Step 1 — Enable the Configurator app embed (if not already enabled)

The Configurator app's theme embed must be active before the app can generate the Template JSON for your store.

1. Go to **Online Store → Themes** in your Shopify admin.
2. On your active theme, click **Customize**.
3. In the left sidebar, click the **App embeds** icon.
4. Find **Configurator** in the list and toggle it on.
5. Click **Save** in the top right.

#### Step 2 — Copy the Template JSON from the Configurator app

1. Open the Configurator app in your Shopify admin.
2. Go to **Configurator** **Settings** in the app's left navigation.
3. Scroll to the **Dedicated Product Template** section.
4. In the **Template JSON** window, click the **Copy** button.

Keep this tab open — you'll paste the JSON in step 7 below.

#### Step 3 — Create the new template

1. Go to **Online Store → Themes** in your Shopify admin.
2. Click the **…** (three-dot menu) on your active theme and select **Edit code**.
3. In the left sidebar, find and select the **Templates** folder. Click the **New File** icon located at the top.
4. In the empty file name space, type `product.configurator.json` as the file name and then click out of it.
5. Click onto the file you just created (`product.configurator.json`).
6. The panel on the right side of the screen will now show JSON text. Click in it and select all (`Ctrl`+`A` on Windows / `Cmd`+`A` on Mac). With all the text selected, delete it by hitting the **Delete** key on your keyboard.
7. Paste the JSON code you copied in Step 2.
8. Click **Save** (top right).
9. You may now close this tab.

#### Step 4 — Assign the template to your configurable products

Once the template exists in your theme, your Configurator products need to be told to use it. You can do this in one click from the Configurator app, or product-by-product in Shopify admin.

**Option A: Assign all Configurator products at once (recommended)**

1. Open the Configurator app in your Shopify admin.
2. Go to **Settings** and scroll to the **Dedicated Product Template** section.
3. Under **Product Assignment**, click **Assign All**.

Every Configurator product will now use the new template.

To revert later (so products go back to your theme's default product template), return to the same section and click **Unassign All**.

**Option B: Assign one product at a time (in Shopify admin)**

1. From your Shopify admin, go to **Products** and open one of your configurable products.
2. In the right sidebar, find the **Theme template** field (under the **Online Store** heading).
3. From the dropdown, select **Configurator.**
4. Click **Save** at the top.

Repeat for each configurable product.

#### Step 5 — Verify it's working

1. Open one of your updated products on the storefront (use an incognito/private window to avoid any cached preview).
2. The page should display your customized layout with the Configurator block in the position defined by the template — no default variant picker, no separate add-to-cart button.
3. Click **Customize** to confirm the configurator opens and works as expected.

#### Troubleshooting

- **The Configurator app's Template JSON window is empty or says the embed isn't enabled.** Go back to Step 1 and make sure the Configurator app embed is toggled on in your active theme, then save and refresh the app's Settings page.
- **The Theme template dropdown doesn't show configurator.** Confirm the file is named exactly `product.configurator.json` (case-sensitive) and that you saved it in the **Templates** folder of your active theme. Refresh the Products admin page after saving.
- **Shopify shows a JSON error when saving the new file.** The paste may have included extra characters or lost a bracket. Re-copy the Template JSON from the Configurator app and try again, making sure you fully selected and deleted the existing file contents before pasting.
- **The product still shows the default layout on the storefront.** Confirm you saved the product after changing the Theme template field. Clear your browser cache or use an incognito window to rule out cached views.
- **The configurator block doesn't appear on the page after applying the template.** Re-check that the Configurator app embed is enabled (Step 1). If it was disabled and re-enabled after you created the template, copy a fresh Template JSON from the app's Settings page and replace the file contents.

#### Related articles

- [How to Set the Configurator Layout](https://shopify-apps-kb.nsource.com/shopify-apps-kb/how-to-set-the-configurator-layout?hsLang=en)
- [How to Create a Configurable Product](https://shopify-apps-kb.nsource.com/shopify-apps-kb/how-to-create-a-configurable-product?hsLang=en)
- [Configurator Settings Overview](https://shopify-apps-kb.nsource.com/shopify-apps-kb/how-to-configure-purchase-and-quoting-settings?hsLang=en)

- [Configurator](https://shopify-apps-kb.nsource.com/shopify-apps-kb/configurator?hsLang=en#main-content)
  
  
  
  
  
    - [Getting Started](https://shopify-apps-kb.nsource.com/shopify-apps-kb/configurator?hsLang=en#getting-started)
    - [Billing & Plans](https://shopify-apps-kb.nsource.com/shopify-apps-kb/configurator?hsLang=en#billing-plans)
    - [Products & Configurations](https://shopify-apps-kb.nsource.com/shopify-apps-kb/configurator?hsLang=en#products-configurations)
    - [Quotes & Quoting](https://shopify-apps-kb.nsource.com/shopify-apps-kb/configurator?hsLang=en#quotes-quoting)
    - [Reports & Analytics](https://shopify-apps-kb.nsource.com/shopify-apps-kb/configurator?hsLang=en#reports-analytics)
    - [Conflict Resolution](https://shopify-apps-kb.nsource.com/shopify-apps-kb/configurator?hsLang=en#conflict-resolution)
    - [Price Sync](https://shopify-apps-kb.nsource.com/shopify-apps-kb/configurator?hsLang=en#price-sync)
    - [Settings](https://shopify-apps-kb.nsource.com/shopify-apps-kb/configurator?hsLang=en#settings)
    - [Troubleshooting](https://shopify-apps-kb.nsource.com/shopify-apps-kb/configurator?hsLang=en#troubleshooting)
    - [Video Guides](https://shopify-apps-kb.nsource.com/shopify-apps-kb/configurator?hsLang=en#video-guides)
    - [Privacy Policy](https://shopify-apps-kb.nsource.com/shopify-apps-kb/configurator?hsLang=en#privacy-policy)
- [Configurator Marketing Automation Add-on](https://shopify-apps-kb.nsource.com/shopify-apps-kb/configurator-marketing-automation-add-on?hsLang=en)

[![nst-dark-logo-250-2](https://shopify-apps-kb.nsource.com/hs-fs/hubfs/nst-dark-logo-250-2.png?width=250&height=65&name=nst-dark-logo-250-2.png "nst-dark-logo-250-2")](https://netsourceinc.com)

Copyright © 2026, NetSource

NetSource Commerce, Inc. | Headquarters - 3700 South Pine Avenue, Ocala, FL 34471 | Tel (800) 709-3240 | Fax (352) 401-0353