How to Add a Custom Template in Shopify (2026)

Last updated
Expert reviewed
5 min read
Jacques Blom
Jacques Blom
CTO at Fudge.

Key takeaways

  • Custom templates let you give specific pages, products, or collections a completely different layout.
  • Create them in the code editor: templates folder → new file (e.g., page.custom.json or product.feature.json).
  • JSON templates define which sections appear on the page — no HTML required.
  • Assign a template to a page, product, or collection via the “Theme template” dropdown in the editor.

One template layout doesn’t fit every page. Your About page needs a different layout than your Contact page. A featured product deserves a different layout than your standard product template. Shopify’s custom template system makes this possible without creating separate themes.

How do I create a custom template in Shopify?

Custom templates live in the templates/ folder of your theme. Each template is a JSON file that defines which sections appear on that page type.

Naming convention:

The part before the dot is the page type. The part after is your custom name. You can name the custom part anything (no spaces, lowercase, hyphens only).


Step by step — creating a custom page template

Step 1 - Duplicate your theme. Online Store → Themes → three-dot menu → Duplicate.

Step 2 - Open the code editor on the duplicate theme. Online Store → Themes → Actions → Edit code.

Step 3 - Navigate to the templates/ folder.

Step 4 - Click “Add a new template” (the + button next to the folder, or look for an “Add template” option).

Step 5 - Select the template type (page, product, collection, etc.) and give it a name (e.g., “landing”).

Step 6 - Shopify creates a new JSON file: page.landing.json.

Step 7 - The default content looks something like this:

{
  "sections": {
    "main": {
      "type": "main-page",
      "disabled": false,
      "settings": {}
    }
  },
  "order": ["main"]
}

This template currently uses the same main content section as the standard page template. You can add additional sections here.


Adding sections to your custom template

To add a hero image section to your landing page template:

{
  "sections": {
    "hero": {
      "type": "image-banner",
      "settings": {
        "image_height": "large",
        "show_text_below": false
      }
    },
    "main": {
      "type": "main-page",
      "settings": {}
    },
    "testimonials": {
      "type": "testimonials",
      "settings": {
        "title": "What our customers say"
      }
    }
  },
  "order": ["hero", "main", "testimonials"]
}

Important: The "type" value must match an actual section filename in your sections/ folder (without the .liquid extension). Use exact names.

The "order" array controls the sequence sections appear on the page.


How do I assign a template to a page?

For pages:

  1. Go to Online Store → Pages → select the page
  2. Look at the right sidebar — find “Theme template”
  3. Select your new template from the dropdown (e.g., “page.landing”)
  4. Save

For products:

  1. Products → select the product
  2. Right sidebar → “Theme template”
  3. Select your template (e.g., “product.feature”)
  4. Save

For collections:

  1. Products → Collections → select the collection
  2. Right sidebar → “Theme template”
  3. Select your template

The template dropdown only shows templates that match the current content type — page templates for pages, product templates for products, etc.


Editing template content in the Theme Editor

Once a custom template is assigned to a page, you can customize it in the Theme Editor:

  1. Online Store → Themes → Customize
  2. Use the page selector at the top to navigate to the page using your custom template
  3. The sections defined in your JSON template appear in the left sidebar
  4. Edit section settings, add new sections (within the template’s scope), and reorder as needed

Changes made in the Theme Editor update the JSON template file automatically.

Build custom Shopify templates by describing what you want to Fudge.
Try Fudge for Free

How do I upload a template?

You can’t upload a pre-built template file directly via the Shopify admin UI. Instead:

For merchants, creating templates through the code editor is the standard approach.


Common custom template use cases

Landing page template. No header navigation, no footer, full-width hero, single CTA. Assign to campaign pages from ads.

Feature product template. More immersive product page with a dedicated video section, expanded ingredient/material details, and a comparison table. Assign to hero products.

Brand story page. Large typography, full-width images, team section. Assign to About page.

Wholesale page. Different product pricing display, a form section, B2B-specific content. Assign to hidden wholesale pages.

Jacques's signature
Build custom Shopify templates and sections by describing them.

You might also be interested in

How to Add Custom Liquid Logic in Shopify (2026)
Add custom Liquid logic to Shopify themes — show content based on product tags, customer tags, metafields, cart contents, or date using Liquid
How to Add Custom JavaScript in Shopify (2026)
Add custom JavaScript to Shopify — use section JS blocks for scoped scripts, theme.liquid for global scripts, or Custom HTML blocks in the Theme
How to Modify checkout.liquid in Shopify Plus (2026)
Edit checkout.liquid in Shopify Plus to customize your checkout layout, add trust content, and build custom upsells