Skip to content

Theme extension

TryOn ships as a Shopify theme app extension with two pieces: a Try On button block you place on your product template, and a Quick Icons badge that decorates listing pages storewide. Both live in Online Store → Themes → Customize.

On your product template, click Add block, search for Try On, and add it. It renders a button that opens the try-on modal when clicked.

The block only renders on products you’ve enabled try-on for — see Enable try-on on a product. Until a product is enabled, the block shows nothing on the live storefront. In the theme editor’s design mode you’ll see a placeholder instead (“The button only shows on products you’ve enabled try on for”), so you can confirm placement without an active product to test against.

  • Button text — defaults to “See it on you”.
  • Font weight, size (small / medium / large / extra large), style (solid / outline / gradient).
  • Colors — a “match my theme color” toggle is on by default for solid and outline styles, so the button follows your theme’s button color automatically; turn it off to set explicit colors. Gradient style always uses its own two colors.
  • Icon and shadow toggles, and a border radius slider.
  • Helper text — an optional line under the button (on by default) that reads differently depending on the product’s mode (AI Swap vs. real-time AR), with its own color, size, and spacing controls.

Quick Icons is a site-wide app embed — turn it on once from the theme editor’s App embeds panel, and it decorates product cards on your home, collection, and search pages with a small “Try On” badge. There’s no per-template placement needed.

Settings: which surfaces it shows on (home / collections / search), badge position (corner), label text, icon visibility, and the same “match theme color” toggle as the button.

Enable try-on on a product — set a category, choose AR or AI Swap, and turn try-on on so the button actually appears.