This article explains how to create and customize a product template — the set of screens a consumer sees when they scan your product. Templates cover fonts, colors, images, and the text on each screen.

Prerequisites

Admin or Editor role.
A product already created (see Creating and Managing Products).

About Templates

Each product in your Dashboard has an active template. The template controls four consumer-facing screens:

Screen	When It Appears
General	Shared style settings that apply to every screen (fonts, colors, backgrounds)
Verify	The first screen the consumer sees — a prompt to click verify to scan the tag
Authenticated	Shown after a successful verification process — displays product details and the Show More option (if enabled)
Retry	Shown if the scan failed to read (for example, the phone moved too fast)

Templates can be shared across multiple products or dedicated to a single product. Any changes to a shared template apply to every product using it.

Activating an Existing Template

On the Product Detail screen, scroll to the Theme Templates section.
Click the template you want to use.
Click Make Active. The template is assigned to this product.

Creating a New Template

On the Product Detail screen, click New template in the top-right corner of the Theme Templates section.
The Template Editor opens with four tabs across the top: General, Verify, Authenticated, Retry.
Enter a name for your template in the title field (for example, Spring 2026 Wine). A descriptive name makes templates easier to find later.
Configure each tab as described below.
Click Save in the top-right corner to persist your work.

Tip: The right-side panel shows a live preview of your changes on a phone frame. Use the dropdown above the preview to switch device sizes.

General Tab — Shared Style

The General tab controls the style that applies to every screen in the template. It is organized into two sections: Font Library and Colors.

Font Library

Setting	Purpose
Heading Font	Font used for all headings across every screen
Body Font	Font used for paragraph text and metafields
Add Font	Load a custom brand font into the Heading Font and Body Font dropdowns

The Heading Font and Body Font dropdowns are pre-populated with a standard set of web-safe fonts. To add your own, click Add Font. The Add Font to Library modal opens with three source tabs: Google Fonts, Adobe Fonts, and Upload.

*Important: If your brand uses a licensed Font, such as Adobe, you cannot simply upload to the Font Library, you need to follow the steps from your Font Manager, generate a Font Kit URL or CSS, that's unique to your licensed account.

Adding a Google Font

Click Add Font, then select the Google Fonts tab.
Fill in: - Font Name — A display label (for example, Roboto Bold). - Font Family — The CSS font-family name from Google Fonts (for example, Roboto). - Google Fonts URL — The embed URL from Google Fonts. Paste the https://fonts.googleapis.com/css2?family=... link.
Click Add Google Font. The font is now available in the Heading Font and Body Font dropdowns with a blue google badge.

Adding an Adobe Font

Click Add Font, then select the Adobe Fonts tab.
Provide the font name, family, and your Adobe Typekit project or kit URL. (Example: https://use.typekit.net/sddfdd.css
Click Add Adobe Font.

Uploading a Custom Font File

Use the Upload tab to load a licensed font file directly — for example, a proprietary brand typeface.

Click Add Font, then select the Upload tab.
Fill in: - Font Name — Display label. - Font Family — The CSS font-family name. - Font File — Drag the font file onto the drop area or click to browse. Supported formats: TTF, OTF, WOFF, WOFF2.
Click Upload Font. The font is added to the library for use on both headings and body text.

Note: Custom fonts uploaded here are scoped to your brand. They are not available across other brands in your workspace.

Colors

Setting	Purpose
Background	Page background color (the area behind the card)
Card Background	Authentication card background color
Card Foreground	Color of text and icons on the card
Primary	Button color and accent color
Primary Foreground	Color of text inside buttons

Use the color swatches to pick a color, or type a hex value directly in the input if you need to match specific brand colors.

Tip: These seven controls (two fonts plus five colors) are the full extent of the basic style system. If you need finer control — padding, borders, hover states, typography tweaks — see Customizing Templates with Advanced Custom CSS.

Verify Tab

The Verify screen is the first screen a consumer sees when they open a scan link on their phone. It prompts them to tap their tag.

Setting	Purpose
Heading	The call-to-action message (for example, `Authenticate your product`). Max 50 characters.
Verify image	An optional custom image displayed above the button.
Verify button text	The button label (for example, `VERIFY`). Max 30 characters.
URL link — Privacy and policies	The privacy policy URL shown at the bottom of the screen.

Authenticated Tab

The Authenticated screen appears when the scan succeeds. It displays product details and the Show More toggle (if enabled).

Setting	Purpose
Heading	The confirmation message (for example, `Your product is authentic`). Max 50 characters.
Tag Tampered	The message shown if the tag's tamper seal is broken. Only applies to tamper-evident tag types. Max 80 characters.
Show more page	Toggle that enables the Show More digital label (see The Show More Digital Label).

Retry Tab

The Retry screen appears if the consumer did not scan the tag correctly — for example, if they moved the phone too quickly.

Setting	Purpose
Heading	The retry prompt heading.
Message	Short explanation of what went wrong and how to try again.
Contact link	Optional link to your brand's support page.

Saving Your Template

Click Save in the top-right corner of the Template Editor. Your changes are immediately live — the next consumer to scan the product sees the updated template.

Important: If this template is assigned to multiple products, every change you save applies to all of them. To give one product a unique template, create a new template and activate it on that product specifically.

Troubleshooting

Issue	Solution
My changes are not visible on a scan	Confirm you clicked Save. Then refresh the scan page on your phone — browsers may cache authentication pages for a few minutes.
The preview looks different from the live scan	The preview is a close approximation. Test with an actual scan on a physical phone for a pixel-accurate view.
I edited the template and other products changed too	Shared templates apply globally. Create a dedicated template for the product you want to customize.
The Heading field rejects my text	Heading is limited to 50 characters. Shorten your message.