Variants work in the canvas but don't appear on your published site. Here's how to fix it.

Canvas vs live site

Canvas: Shows designVariants from the CMS snapshot (static labels for layout).

Live site: Fetches real variants from Swell API (with availability).

If variants show in canvas but not on the live site, the issue is with the runtime fetch.

Common causes

1. Credentials not injected

The published site can't fetch from Swell without credentials.

Fix:

1. Open TGC plugin in Framer

2. Verify you're connected to Swell

3. Republish your site

2. Product has no variants in Swell

The product exists but has no variant options configured.

Check:

1. Go to Swell dashboard

2. Open the product

3. Look for Variants or Options section

4. Verify variants exist (Size, Color, etc.)

Fix: Add variants in Swell, then re-sync.

3. swellId mismatch

The CMS has an old or incorrect swellId.

Fix:

1. Re-sync your products

2. The correct swellId will be updated

4. Runtime not loading

Check:

1. Open published site

2. Open dev tools (F12) → Console

3. Type: window.__tgc

4. Should return an object, not undefined

Fix:

• Check for JavaScript errors

• Ensure TGC components are on the page

• Republish

5. API errors

Check:

1. Open dev tools → Network tab

2. Filter by "swell"

3. Look for failed requests (red)

4. Check the response for error messages

Debugging checklist

Canvas shows variants, live doesn't

This specific scenario usually means:

1. Credentials issue — Republish your site

2. Swell API error — Check Network tab for errors

3. Product deleted in Swell — The CMS still has old data; re-sync

Related

• Variant selector

• Loading variants won't go away

• Credentials