Fitting Widget Docs

Quick Start

Get the Fitting Widget running in minutes

Quick Start

Follow these steps to add virtual try-on to your e-commerce site.

1. Get Your API Key

Sign up at widget.try-on.ru to obtain your free API key.

2. Load the Widget Script

Add the following <script> tag to your page, ideally right before the closing </body> tag:

<script
  src="https://widget.try-on.ru/fitting-widget-bundle.js"
  id="fitting-widget-bundle"
></script>

3. Initialize the Widget

<script id="fitting-init">
  window.fitting = window.fitting || function() {
    (window.fitting.q = window.fitting.q || []).push(arguments);
  };
  window.fitting('init', {
    apiKey: 'YOUR_API_KEY'
  });
</script>

4. Add a Container

Place a <div> wherever you want the widget to appear:

<div id="widget-container"></div>

5. Launch the Widget

Call the create method when the user clicks a button:

window.fitting('create', {
  targetElementId: 'widget-container',
  model: 'balanced',
  tryonItems: [
    {
      productName: 'Classic Denim Jacket',
      url: 'https://your-store.com/images/jacket.jpg',
    },
  ],
});

Result

Your customers can now upload a photo and see the garment on them instantly.

Next Steps