Shopify Integration Guide

Add Virtual Try-On to
Your Shopify Store

One line of code in your theme.liquid file. The "Virtual Try-On" button appears on every product page automatically. Your customers upload a photo and see themselves wearing your products in 25 seconds.

What Your Customers Will See

After installation, a golden "Virtual Try-On" button appears on every product page — right next to "Add to Cart." Customers tap it, upload a photo, and get a photorealistic AI result in 25-40 seconds.

👗

Silk Evening Dress

$89.00

🔒 Photos processed once & deleted. Never stored.

🛍
Visits product page
Button appears automatically
📷
Taps "Try On"
Uploads selfie or full-body
AI generates result
25-40 seconds
🛒
Buys with confidence
-40% returns

Installation — 4 Steps, 5 Minutes

1 Create Tryva Account & Copy API Key

You need a Tryva account and your unique API key. This key connects the widget on your Shopify store to your Tryva account.

A Sign Up Free

Go to tryva.ai/signup and create a free account. You get 6 free AI credits instantly — no credit card required.

B Copy Your API Key

After login, click Settings at the bottom of the left sidebar. You'll see your API Key. Click "Copy" to copy it to your clipboard.

🔑
Your API Key looks like: tryva_sk_a1b2c3d4e5f6...
Keep it private — this key is tied to your account and credits.

2 Open theme.liquid in Shopify

Now open the main layout file of your Shopify store. This file controls the structure of every page — including product pages where the try-on button will appear.

Follow this exact path in your Shopify Admin panel:

🏠 Shopify Admin 🛍 Online Store 🎨 Themes ⋮ Actions ▼ 📝 Edit Code

After clicking "Edit Code", you'll see the Shopify code editor. In the left sidebar, click the Layout folder, then click theme.liquid:

your-store.myshopify.com/admin/themes/current/editor
📁 Layout
📁 Templates
📁 Sections
📁 Snippets
📁 Assets
📁 Config
Layout
  • 📄 theme.liquid ← CLICK THIS
  • 📄 password.liquid
  • 📄 checkout.liquid
💡
"Edit Code" bulamıyor musunuz? Themes sayfasında, aktif temanızdaki "Customize" butonunun yanındaki ⋮ (üç nokta) ikonuna tıklayın. Açılan menüden "Edit code" seçin.

3 Paste Widget Code Before </body>

In the theme.liquid file, scroll all the way to the bottom. Find the closing </body> tag. Add the Tryva script on the line just above it.

Here's exactly where to paste it:

... 285 {{ content_for_layout }} 286 287 <!-- your theme scripts above --> 288 289 <!-- 👇 ADD THIS LINE 👇 --> 290 <script src="https://tryva.ai/tryon.js?key=YOUR_API_KEY"></script> 291 292 </body> 293</html>
⚠️
YOUR_API_KEY kismini Step 1'de kopyaladiginiz gercek API key ile degistirin!
Dogru hali soyle gorunmeli:
<script src="https://tryva.ai/tryon.js?key=tryva_sk_a1b2c3d4e5f6g7h8"></script>

Kopyala-yapistir icin tek satir:

<script src="https://tryva.ai/tryon.js?key=YOUR_API_KEY"></script>
Where exactly? The script must be between the last {{ content_for_layout }} or other scripts and the </body> tag. It should NOT go inside <head>.

4 Save & Test Your Store

Click the green "Save" button in the top right corner of the Shopify code editor. Then visit your store to verify.

🎉
That's it! Your store now has AI virtual try-on. The widget is live on every product page. Your first 6 try-ons are free. When you're ready, upgrade for more credits →

Troubleshooting

Button doesn't appear?

Try-on starts but fails?

Check your credit balance in Dashboard → Home. Free accounts get 6 one-time credits. Upgrade to a paid plan for monthly credits.

Customize the Widget

Add URL parameters to change button appearance:

<!-- Custom button color (hex without #) --> <script src="https://tryva.ai/tryon.js?key=YOUR_KEY&color=000000"></script> <!-- Turkish language --> <script src="https://tryva.ai/tryon.js?key=YOUR_KEY&lang=tr"></script>
🎨

color

Button color as hex (no #). Default: C5A572 (gold). Example: 000000 for black.

🌐

lang

Widget language: en or tr. Auto-detects browser language if not set.

Technical Details

15KB Script

Loads async. Zero impact on page speed or Core Web Vitals scores.

🎨

All Themes

Dawn, Debut, Brooklyn, Sense, OS 2.0 and all custom themes.

🔒

Privacy First

Customer photos processed once and deleted. Never stored or used for training.

📊

Analytics

Track widget views, try-ons, add-to-cart from your Tryva dashboard.

📱

Mobile Ready

Fully responsive. Touch-optimized for phones and tablets.

👕

Auto-Detect

Reads product title to classify: tops, dresses, outerwear, swimwear, pants.

Supported Products

👕

Tops & Shirts

👗

Dresses

🧥

Outerwear

🩲

Swimwear

👖

Pants & Skirts

Removing the Widget

To remove: go back to Edit Code → Layout → theme.liquid, delete the <script> line you added, and click Save. The button disappears instantly.

Pricing

Each virtual try-on = 1 credit. Start free, upgrade when ready.

Free

$0

6 credits

Starter

$29

100 credits/mo

Growth ⭐

$69

300 credits/mo

Pro

$139

800 credits/mo

FAQ

Does it slow down my store?

No. Under 15KB, loads async. Zero Core Web Vitals impact.

What Shopify plan do I need?

All plans: Basic, Shopify, Advanced, Plus. No Plus required.

Custom domain?

Works with both mystore.myshopify.com and custom domains like shop.mybrand.com.

Hide button on specific products?

Add Shopify tag no-tryon to any product — the button won't show on that page.

Customer photo privacy?

Photos compressed in browser, encrypted, processed once, deleted. Never stored, never used for AI training. See Privacy Policy.

Ready to add virtual try-on?

6 free credits • No credit card • All themes • 5 min setup

Get Started Free →