TryLook

Documentation

Installation

One script tag, pasted once into your product page template. It detects the product on the page, checks whether a model exists, and renders a button only if one does.

<script src="https://cdn.trylook.app/embed.js"
        data-store="YOUR_STORE_KEY" async></script>

Your store key is in the dashboard under Install. It is public by design — it ships in your page source — and it is safe there because it is read-only, rate-limited, and locked to the domains you register. Anything that writes needs your private key, which never leaves your server.

Register your domain. Until you add your storefront domain in the dashboard, the embed will refuse to serve in production. This is what stops a copied store key from working on someone else's site.

Shopify

  1. Online Store → Themes → Edit code.
  2. Open layout/theme.liquid.
  3. Paste the snippet immediately before </body> and save.

On Online Store 2.0 themes you can use the TryLook theme app extension instead, which avoids editing theme code entirely.

WooCommerce

  1. Appearance → Theme File Editor → footer.php.
  2. Paste the snippet before </body>.

A code-snippets plugin is the better option if you update your theme regularly — direct theme edits are lost on update.

Custom storefronts

The script works anywhere. If it cannot detect your SKU automatically, tell it explicitly:

<script>window.TryLookProduct = { sku: "SOFA-LINEN-3S" };</script>
<script src="https://cdn.trylook.app/embed.js" data-store="KEY" async></script>

You can also set data-sku on the script tag, put data-trylook-sku on any element, or control placement with data-mount="#your-selector".

SKU matching

The embed tries these in order, and stops at the first that produces a value:

  1. window.TryLookProduct, data-sku, or data-trylook-sku
  2. Shopify's ShopifyAnalytics.meta (selected variant SKU first)
  3. Product structured data (JSON-LD sku, mpn or productID)
  4. WooCommerce's SKU element or post ID
  5. product:retailer_item_id meta tag

On our side, that identifier is matched against your product's SKU, handle, or platform ID. If your SKUs are inconsistent — and they usually are somewhere — set the mapping by hand in the dashboard. Manual override is always available.

Capture guide

This is the part that decides whether your models are good. It matters more than any setting in the dashboard.

  • 20–40 photos in a full circle around the product.
  • Move the camera, not the product. A turntable is fine, but then the background must turn with it, or stay perfectly plain.
  • Even, diffused light. An overcast window or a softbox. Never a bare flash.
  • Plain background in a contrasting mid-tone — mid-grey works for almost everything.
  • 60–70% overlap between consecutive photos.
  • Vary your height. A ring of eye-level shots leaves the top and underside guessed at.
  • Fill the frame, but never crop part of the product away.
  • Sharp focus throughout. One blurred photo is worse than one missing photo.

Also: measure the product and enter its real dimensions. AR places it at whatever size the model claims, and a sofa that appears at 70% scale in someone's living room is worse than no AR at all.

Products that will not reconstruct well

Photogrammetry has hard limits. We flag these when you add a product, before you spend a credit:

Material or shapeWhy it failsWhat to do
Glass, transparent parts No trackable surface features Supply a CAD/3D model
Mirrors, chrome Every photo sees a different reflection Supply a CAD/3D model
High gloss, lacquer Moving highlights confuse matching Diffused light, no flash
Solid black Absorbs light, no visible texture Bright even light, mid-grey background
Pure white Blows out to a featureless shape Mid-tone background, underexpose slightly
Thin structures Wire, chain and slim legs vanish or fuse More angles, much closer

Performance

The embed script is under 4KB gzipped, loads asynchronously, and defers its work to browser idle time. The 3D viewer is a separate bundle fetched only when a shopper clicks. Models are served in multiple levels of detail — phones and slow connections get a light version first — with meshopt geometry compression and KTX2 textures, from a CDN with immutable caching.

Nothing we ship runs before your page paints.

Troubleshooting

The button does not appear

  1. Add data-debug to the script tag and check the browser console — it logs which detector matched and what SKU it found.
  2. Confirm the product has an approved model. Models in review do not serve.
  3. Confirm your storefront domain is registered in the dashboard.
  4. Check the SKU on the page matches the SKU on the product in TryLook.

The AR button is missing on iPhone

iOS AR Quick Look needs a USDZ file. If the model has no USDZ, iPhone shoppers get the 3D viewer without AR. The product page in your dashboard says so explicitly when that is the case.

The model is the wrong size in AR

Check the dimensions on the product. AR uses them, and if they were entered in centimetres rather than metres the product will appear a hundred times too large.