AI Shopify Section Generator

Shopify parses the JSON inside {% schema %} strictly: one tag per file, no comments, no trailing commas, and every setting id unique within the section. The generator writes to that rule, using only real setting types (text, richtext, image_picker, url, color, range, select and the rest of Shopify's documented list) with the exact extra keys each one needs, like min/max/step for a range or an options array for a select.

Ask for a Theme block instead of a section when you want something reusable inside several different sections (a countdown badge, a trust-icon row); ask for Merchant-added blocks when the content is a repeatable list (cards, logos, testimonials) the merchant should be able to add, remove and reorder in the theme editor.

Any styling the section needs goes inside Shopify's {% style %} tag, scoped with #shopify-section-{{ section.id }} as the outer selector. That's the same mechanism theme.liquid uses for color settings that update live in the editor, and it stops the section's CSS from also affecting a second copy of the same section elsewhere on the page.

1. 01

   Open the code editor

   In Shopify admin, go to Online Store > Themes, find your theme, then ⋮ > Edit code.

2. 02

   Add the file

   Under Sections (or Blocks for a theme block), click Add a new section/block, name it to match the generated filename, and paste the code in.

3. 03

   Add it to a page

   In the theme editor, click Add section (or Add block inside a section that accepts theme blocks) and pick it from the list.