This guide walks through adding a virtual try-on button to your Shopify product pages with fesch. It follows the actual onboarding screen by screen. Most of the time goes into deciding where the button looks best.
Before you start
- An Online Store 2.0 theme. The button is an app block, and app blocks work on every Online Store 2.0 theme (Dawn, Horizon and almost every theme released in the last few years). If you can add blocks to your product page in the theme editor, you're fine.
- At least one clothing or accessory product with a clear product image. A flat lay, a hanger shot or an on-model photo all work. The clearer the garment, the better the result.
- Your phone at the end, to test it the way your shoppers will.
Step 1: Install fesch
Open fesch on the Shopify App Store and click Install. Shopify shows the permissions the app asks for: your products and your theme. fesch doesn't request customer or order data.
You start on the Free plan with 30 try-ons a month. You don't need to pick a plan to finish setup.
Step 2: See your first try-on
The app opens on Set up Virtual Try-On, step 1 of 3. While you were installing, fesch picked a clothing product from your catalog and rendered it on a model. You see three tiles: Your product, A shopper and Their try-on.
From here you can:
- Switch the model. Pick one of the four model photos under the result to see the same product on someone else.
- Use your own photo. The upload tile next to the models lets you try it on yourself.
- Try another product. Use this if the first pick isn't representative of what you sell.
Your first three demo renders are free. Demos after that count toward your monthly try-ons. When you are happy with what you see, click Looks great, continue.
If nothing renders, the screen asks you to Pick a product to try on. That happens when the app can't find a clothing product with a usable image.
Step 3: Put the button on your product page
Step 2 of 3 is Put it on your product page. Click Add to my theme. Your theme editor opens on a product page with the Virtual Try-On block already placed at the bottom of the product section.
- Drag the block up so it sits directly above or below your buy buttons. This is the single biggest factor in how many shoppers use it.
- Press Save in the theme editor.
Back in fesch, the screen says "Watching your theme" and confirms on its own as soon as the block is saved on your published theme. No need to come back and click anything.
Prefer to add it manually? Open Online Store → Themes → Customize, switch to a product page, then Add block → Apps → Virtual Try-On, drag it above the buy buttons and press Save. fesch detects it the same way.
If your store uses more than one product template (for example a separate template for accessories), add the block to each template that should show it.
If it still isn't detected after a couple of checks, the onboarding offers Mark as done or We'll set it up for you, which opens a chat with us.
Step 4: Style the button
With the block selected in the theme editor, you can change:
- Button label. The field starts empty, and the button then uses the built-in label in the shopper's language ("Virtual Try-On" in English). The try-on window follows the storefront language too (English, German, French, Spanish, Italian and Dutch). Anything you type here is shown as typed, in every language, so leave it empty if you sell in several languages.
- Button color and text color. Match your add-to-cart button, or pick a secondary style if you want it to sit under the main button.
- Button size: small, medium or large.
- Alignment: left, center or right.
Press Save again when you're done.
Step 5: Choose where the button shows
Step 3 of 3 asks Where should the button show?
- All products is selected by default, and most stores keep it.
- Specific products or collections lets you pick from your catalog with Shopify's product and collection picker. Use this if you also sell items that can't be tried on, like bags or home goods.
Click Finish setup and you land on the dashboard.
You can change this any time under Product targeting, which also has Exclusions: products or collections that never show the button, whatever else is selected.
Step 6: Set a daily limit per shopper
Under Settings → Daily try-on limit you choose how many try-ons one shopper can make in a rolling 24 hours: from 1 to 20 per day, unlimited, or Paused, which stops new try-ons without removing the block. The default is 5. It keeps one curious visitor from using up your monthly try-ons.
Step 7: Test it on your phone
Open one of your product pages on your phone, not in the theme editor.
- Tap Virtual Try-On. The try-on window slides up and explains what happens to the photo before anything is uploaded.
- Tap Upload or take a photo and use a full-body or upper-body photo in good light.
- Wait for the result. It appears with a small "AI preview · fit may vary" note.
- Change the color on the product page and try again: the try-on uses the image of the color variant you picked, as long as the variant has its own image.
Your dashboard now shows the try-on, and from here on it counts try-ons, shoppers who tried on and your most tried products.
Troubleshooting
The button doesn't show. Check, in this order: is the block saved on your published theme; does this product use the template you edited; is the product excluded in Product targeting; on the Free plan, are the 30 monthly try-ons used up? The dashboard shows a warning if it can't find the block on your published theme, with a button to re-add it.
The result looks off. Use a product image where the garment is clearly visible and not cut off. On-model photos work, but a clean flat lay or hanger shot usually gives the most faithful result. For shoppers, a front-facing photo with the upper body visible works best. Photos with several people, children or very small figures are rejected before rendering, and failed or rejected renders never count toward your try-ons.
The button is there but nobody uses it. Move it closer to the add-to-cart button and make sure it's visible on mobile without scrolling past the description.
What's next
- If you're still deciding, our 2026 buyer's guide to virtual try-on covers how to measure whether it works, and this comparison puts fesch next to six other apps.
Questions during setup? Use the chat in the fesch dashboard. We answer in English or German.
Frequently asked questions
Do I need to edit theme code to add a try-on button?
No. fesch installs as an app block. You add it in the Shopify theme editor, drag it next to your buy buttons and press Save. Your theme needs to support app blocks, which every Online Store 2.0 theme does.
Why doesn't the try-on button show on my product page?
The usual causes are: the block was saved on a theme that isn't published, the product uses a different product template than the one you edited, the product is excluded in Product targeting, or the Free plan's monthly try-ons are used up. The fesch dashboard warns you when it can't find the block on your published theme.
Can the button label change with the shopper's language?
Yes. Leave the Button label field in the block settings empty, which is the default, and the button uses the built-in label in the shopper's language (English, German, French, Spanish, Italian or Dutch). Any label you type is shown as typed in every language.