Font not loading in live preview

3 min read · Last updated May 27, 2026

Common causes

1. Content Security Policy (CSP) blocking Google Fonts. Check your theme.liquid or Shopify's Content Security Policy — font-src should include https://fonts.gstatic.com.
2. Font file failed to load. Open browser DevTools → Network tab → filter by 'font' → look for red 4xx/5xx status.
3. Ad blocker or privacy extension blocking Google Fonts. Test in incognito with extensions disabled.
4. Custom uploaded font missing license verification. PIMW Product Personalizer accepts custom TTF/OTF/WOFF uploads but requires you have a commercial license.

Verify Google Fonts CSP

PIMW Product Personalizer loads fonts from fonts.googleapis.com (CSS) and fonts.gstatic.com (font files). If your Shopify theme or CDN has a strict CSP, add both origins to font-src and style-src.

Fallback behavior

If a font fails to load, PIMW Product Personalizer falls back to a system serif or sans-serif. The customer's chosen font name is still stored as a line-item property on the order, so your production team knows the intent — the print file is generated with the correct font server-side even if the preview fell back.

Frequently asked questions

What is common causes?

Content Security Policy (CSP) blocking Google Fonts. Check your theme.liquid or Shopify's Content Security Policy — font-src should include https://fonts.gstatic.com . Font file failed to load. Open browser DevTools → Network tab → filter by 'font' → look for red 4xx/5xx status. Ad blocker or privacy extension blocking...

How do I verify google fonts csp?

PIMW Product Personalizer loads fonts from fonts.googleapis.com (CSS) and fonts.gstatic.com (font files).

What is fallback behavior?

If a font fails to load, PIMW Product Personalizer falls back to a system serif or sans-serif.