Embed Tryona Widget on Your Shop Page with one line

Just put this code at the end of body tag:


        ...
        <script async data-tryon-integration="true" 
            src="https://api.tryona.com/integrate.js?apikey=[apiKey]&selectors=[imageSelector]&lang=en">
        </script>
    </body>

Replace [apiKey] with your Public API Key from API Keys section in Tryona dashboard.

Replace [imageSelector] with CSS selector for product images on your shop page, e.g. .product-image img or .product-card img.

Replace [lang] with your language code, e.g. en for English.

The script will automatically add a "Try On" button on each product image matching the selector.

When users click the "Try On" button, the Tryona widget will open, allowing them to virtually try on the selected garment using their selfie or a model from our library.

Optional parameters:

  • debug=true - for debugging
  • hideSearch=1 - hide garments search
  • hideIntro=1 - hide the intro instructions
  • hideLinks=1 - hide link to garment page button
  • buttonText=[Text] - custom try-on button text

Example:

Sample Shirt
Sample Pants