Skip to main content
Your virtual.fit dashboard controls product availability and shopper access. The storefront integration presents the fitting room on eligible product pages.

Runtime flow

1

Identify the storefront

Shopify provides the installed store context automatically. Custom JavaScript sites use a public siteKey and an exact allowed origin.
2

Resolve the current product

Shopify supplies its product ID and handle. Custom sites resolve a synced product from the page URL or an explicit setProduct call.
3

Check product readiness

The product must be available for try-on and have a usable garment image. Otherwise, the fitting room stays hidden.
4

Show the interface

virtual.fit anchors the Try On control to the main product media and keeps the shopper on the merchant storefront.
5

Generate and measure

The shopper uploads a photo, starts a try-on, and receives a generated result. Usage and commerce activity appear in virtual.fit analytics.

Control plane and storefront

Areavirtual.fit controlsYour storefront supplies
AccessAvailable products, customer access, daily limitsCustomer identity and login return URL
Product dataCatalog records, usable images, product instructionsCurrent product ID, handle, title, and image
ExperienceProduct readiness and shopper policyPlacement, labels, terms, and appearance
MeasurementAnalytics and result reportingCart, checkout, and purchase events for custom sites
Storefront presentation settings cannot make an unavailable product eligible. Product state and customer access are managed in virtual.fit.

Product gating

The fitting room renders only when all required state is present:
  • The storefront is connected and authorized.
  • The current page resolves to a known product.
  • That product is available for try-on.
  • Product preparation found at least one usable garment image.
  • The configured mount target exists on the page.
This fail-closed behavior prevents a broken or incomplete fitting room from appearing on unrelated pages.

Shopper identity

Shopify supplies signed-in customer context through the app integration. Custom sites can call setCustomer after login and on identity changes. Anonymous shoppers receive a storefront-scoped identity unless your access policy requires login. Use setConsentMode('cookieless') when analytics must omit shopper identity. See Privacy and consent. Custom JavaScript developers can find the stable integration commands in the Browser API reference.