Sign Customiser

How to enable/disable the iframe embed on your Shopify app block

Copy page

Turn the experimental iframe embed on or off for the Sign Customiser app block. Use it when your theme's CSS or JavaScript interferes with the direct embed.

Last updated:

The Sign Customiser app block loads the customiser one of two ways: mounted directly into your theme’s page (the default), or inside an isolated iframe. The Use iframe (experimental) checkbox is the switch between them. This guide shows you where that setting lives and how to turn it on or off.

Note: This setting lives on the Sign Customiser app block — the section you add through the Shopify theme editor. If you haven’t added the app block yet, follow Install Customiser on a Product or Page - App Blocks first.

What the iframe embed does

By default, the customiser mounts directly into your theme’s page. It shares the page’s CSS and JavaScript, which keeps it lightweight — but on a heavily customised theme, those styles or scripts can occasionally interfere with how the customiser looks or behaves.

With the iframe embed on, the customiser loads inside an isolated iframe served from web.signcustomiser.com. Your theme’s CSS and JavaScript can’t reach inside it, so the customiser renders the same way it does everywhere else, no matter what your theme is doing around it.

When to turn it on

Reach for the iframe embed when the direct embed doesn’t render cleanly — for example:

  • Your theme’s styles bleed into the customiser and break its layout.

  • A theme script or page builder clashes with the customiser and stops it loading.

  • The customiser looks inconsistent from one page or template to the next.

If the direct embed already works, there’s no need to switch. The setting is labelled experimental, so treat it as a fix for theme conflicts rather than the default choice.

Enable the iframe embed

  1. From your Shopify admin, go to Online Store > Themes.

  2. On the theme you want to edit, click Customise to open the theme editor.

  3. Open the page or product template that has the Sign Customiser section.

  4. Click the Sign Customiser section to open its settings.

  5. Scroll to Advanced settings and tick Use iframe (experimental).

  6. Click Save.

Preview the page — the customiser now loads inside the iframe.

Disable the iframe embed

  1. Open the same Sign Customiser section in the theme editor.

  2. Under Advanced settings, untick Use iframe (experimental).

  3. Click Save.

The customiser goes back to mounting directly into your theme’s page.

Sticky Visualiser isn’t supported in the iframe

The Sticky Visualiser setting doesn’t work while the iframe embed is on. Your Height Percentage and Height Reduction settings still apply. If you rely on the sticky visualiser, keep the iframe embed off.

Still not rendering?

If neither the direct embed nor the iframe embed looks right — or you’re on an old theme, a page builder, or a headless storefront — use the manual iframe install instead. See Setup customiser on Shopify App embed theme. Still stuck? Contact our support team and we’ll take a look.