Install Sign Customiser in a Shopify theme with an app block

Use this guide to add Sign Customiser to a Shopify page or product template. Use an app block.

Cannot find Sign Customiser under Apps? Read Install Sign Customiser in a Shopify theme without app blocks.

Step 1: Create a custom template

In Shopify admin, go to Online Store.
Find your live theme. Select Edit theme to open the theme editor.
Open the Home page drop-down menu.
Select a template type.
Select Create template.
In the Name field, enter a template name, such as Custom sign.
Select Create template.

Step 2: Add the Sign Customiser section

Sign Customiser works in a page template and in a product template.

On the sidebar, select Add section.
Select the Apps tab. Then select Sign Customiser.
Enter the Sign Customiser ID. Read Find your Sign Customiser ID. If you leave the field blank and Use iframe (experimental) is off, the block shows the customiser with the lowest Customiser ID. Leave the field blank only if your Store has one customiser.
Set the options that you need.
- Preset Code: Enter a preset code. The customiser opens with a saved sign design. Read Sign Presets.
- Force full width: Turn this on to make the customiser full width. Use it when your theme limits the width. It is in Advanced settings.
- Use iframe (experimental): Turn this on to load the customiser in an isolated frame. It is in Advanced settings. Read Use the iframe option in the Shopify app block.
Select Save.

The block settings show Force full width under Advanced settings.

The Advanced settings of the Sign Customiser block in the Shopify theme editor. The settings are Language code override, Use iframe (experimental), Initial Screen, Force full width and Force full height. The Force full width switch is off.

Step 3: Assign the template

Add the customiser to a page

Go to Online Store > Pages.
Open the page.
In the Online store section, open the Theme template drop-down menu.
Select the template that you created.
Select Save.

Add the customiser to a product

Go to Products.
Open the product for the customiser.
In the Theme template section, open the drop-down menu.
Select the template that you created.
Select Save.

Open the storefront page. Complete an add-to-cart test.

If a generated product has a zero price, read Troubleshooting Zero-Amount Products Purchased on Shopify.