Shopping Pages Template Editor

​

Purpose

The Shopping Pages Template Editor allows you to visually design and manage the structure and default styling of a shared template for your product-listing pages. By defining a template here, you establish a consistent layout and design that applies to every individual shopping page built from it. It sits at the core of the Shopping Pages workflow, letting you drag and drop sections like hero banners, product grids, and FAQs into a master layout. Any changes published here immediately roll out to all shopping pages using this template, automatically queuing AI copy generation for any newly added fields.

​

What’s on the page

Page header Shows your current location (“Shopping Pages › Templates › [Template Name]”), a back arrow to return to the Templates list, and action buttons for saving or publishing your work. Template canvas The main visual area where you construct the template. It displays the page exactly as it will appear live, but with empty placeholders for content so you can see how the default layouts behave. Canvas bar text A small notice reading “Applies to every page using this template.” to remind you of the scope of your edits. Outline Typically found on the side, this lists all the sections currently in your template (such as Hero, Intro, Product grid, Banner, FAQ, Image and text). It also contains a theme/brand row that links out to the branding editor. Section inspector When you click a section in the canvas, this panel opens to show its editable properties. For the product grid, it displays style tokens (Card style, Image aspect, Image fit, Text alignment, Title size, Grid gutter, Card padding, Hover style, Button style). It includes a note: “Style tokens above come from the brand unless this template overrides them.” and “Each field above is either the same on every page, or set per page.”

​

What you can do here

• Save draft: Saves your current progress manually. (The editor also automatically saves your work 800 milliseconds after you stop typing or moving elements).
• Publish: Opens the Publish this template? confirmation dialog.
  • The dialog explains: “Publishing updates this shared template. These pages will queue copy generation for unresolved fields:” followed by a list of affected pages, or “No pages require copy generation.”
  • Click Publish and generate copy to push the template live.
  • Click Cancel to return to the editor.
• Reset to brand: Inside the section inspector for the product grid, if a style token is currently overriding your website’s global brand settings (e.g., showing a “Template” badge), you can click this button to clear the template-specific override and resume inheriting the brand’s default look.
• Navigate to edit brand: Click the brand/theme row in the outline to leave the template editor and open the global branding editor. (Brand settings cannot be edited directly on this page).
• Navigate back: Click the back arrow or breadcrumbs to return to the Templates list. The editor will automatically save any pending edits before you leave.

​

Data shown

• Your template layout: The saved structure, sections, and style overrides for this specific template.
• Brand theme: Your website’s global visual settings, applied as a read-only preview layer so you can see how the template looks with your brand’s fonts and colors.
• Your uploaded assets: Images available for selection in image fields.

​

Common workflows

Edit a template’s structure

1. Open the template editor from the Templates list.
2. Drag and drop sections in the canvas or outline to add, remove, or reorder them.
3. Click a section in the canvas to open the inspector.
4. Modify the layout or style tokens as needed. Your work is saved automatically.

Publish template updates

1. After making changes, click Publish in the top right.
2. Review the list of existing pages that will be affected by this layout change in the Publish this template? dialog.
3. Click Publish and generate copy to confirm.

Revert a style to the brand default

1. Select the product grid section in the canvas.
2. In the inspector, look for a style token that indicates it is overriding the brand (e.g., showing a “Template” badge).
3. Click Reset to brand next to it.

​

Empty, loading, and error states

• Loading: Shows an animated spinner while your template, permissions, and theme data load.
• Error: Displays “Couldn’t load this template. Refresh to try again.” if the system fails to retrieve the template.
• Empty / No Access: If no website is active, shows “Select a website to edit its templates.” If you lack access to the feature, shows “Templates are unavailable for this website.”

​

Linked from / links to

• Linked from: The Templates list (by clicking on a template row or its edit action).
• Links to: The Templates list (via the back arrow) and the Shopping Pages branding editor (via the brand row in the canvas outline).

​

Common support questions

Why are the “Save draft” and “Publish” buttons disabled? “Save draft” is disabled if there are no unsaved changes or a save is already in progress. “Publish” is disabled if there are no unpublished changes to push live. Both buttons are entirely hidden if your role only has “viewer” permissions. Do I need to save before leaving the page? No. The editor automatically saves your work as a draft less than a second after your last edit, and it forces a final save if you click the back button. If you try to close your browser tab before a save finishes, your browser will warn you. How do I change the font or main colors shown here? Template structure and content are edited here, but global brand themes (like fonts and brand colors) are managed separately. Click the brand row in the outline to navigate to the branding editor. What happens to existing pages when I publish a template? When you hit publish, every existing shopping page that uses this template will immediately adopt the new layout. If you added new sections that require AI-written copy, the system will automatically queue those pages to generate the missing text.