Managing blocks in Checkout Blocks

Plan requirement

Checkout Blocks is available only to merchants on the Shopify Plus plan.

You can edit the content of existing blocks at any time. Depending on the type of block, you can manage some blocks in the Blocks list of the Checkout Blocks app, and some blocks in the checkout and accounts editor directly.

The following types of block are managed in the Blocks list of the Checkout Blocks app:

• Custom field
• Dynamic content
• Line item edit
• Line item content

The following types of block are managed in the checkout and accounts editor directly:

• Shipping & payment icons
• Static content

The address blocker is managed in the Checkout Blocks app's Settings.

Sort blocks by priority

Customers might qualify for multiple blocks of the same type within checkout. To determine which block displays to a customer, the block priority is used. Block priorities are set for each applicable block type, such as custom field or dynamic content. Blocks are sorted by priority starting from 1, and the highest-priority block displays when a customer is eligible.

Consider making the blocks with the most specific display rules have the highest priority, and make blocks with more general display rules have the lowest priority.

Steps:

1. From your Shopify admin, click Sales channels > Checkout Blocks.
2. Click Blocks.
3. Click ⇅ Edit priority.
4. In the Edit priority dialog, select the type of block that you want to adjust the priority for.
5. In the Priority column, re-number the blocks based on your preferred priority. The block with the priority of 1 displays first in checkout.
6. Click Save.

Rename a block

You can rename a block at any time. Block names are for internal use only, and aren't displayed to customers.

Note

You can't rename an address blocker, a shipping & payment icons block, or a static content block because those block types don't have block names.

Steps:

1. From your Shopify admin, click Sales channels > Checkout Blocks.
2. Click Blocks.
3. Click the block that you want to rename.
4. Click More actions ⌄ > Rename block.
5. In the Block name field, enter a new block name.
6. Click Rename.

Edit a block

You can edit the contents of an existing block at any time. Depending on the type of block, you can edit a block from the Blocks list of the Checkout Blocks app or from the checkout and accounts editor directly.

The address blocker can be edited from the Checkout Blocks app's Settings.

Steps:

From Checkout Blocks

The following steps apply when you want to edit a custom field block, dynamic content block, line item edit block, or line item content block:

1. From your Shopify admin, click Sales channels > Checkout Blocks.
2. Click Blocks.
3. Click the name of the block that you want to edit.
4. Update the existing content of block.
5. Click Save.

From Checkout and accounts editor

The following steps apply when you want to edit a shipping & payment icons block or a static content block:

1. From your Shopify admin, click Settings > Checkout.
2. In the Configurations section, click Customize on the checkout configuration with the block that you want to edit.
3. In the checkout and accounts editor, click the app block that you want to edit.
4. Update the existing content of the block.
5. Click Save.

Duplicate a block

When creating similar blocks, you can duplicate an existing block to save time configuring block settings. By default, a duplicated block can be saved only as a Draft. Once the duplicate block is saved, you can set it as Active.

Note

You can't use the duplicate function for a shipping & payment icons block or a static content block. Those blocks must be created and manually duplicated in the checkout and accounts editor. You can't duplicate an address blocker either because only 1 address blocker exists at a time.

Steps:

1. From your Shopify admin, click Sales channels > Checkout Blocks.
2. Click Blocks.
3. Click the name of the block that you want to duplicate.
4. Click Duplicate.
5. Customize the settings of the duplicate block.
6. Click Save.

Export a block

You can export a block as a JSON file. You can then modify the JSON file and import the file to add the new block.

Note

You can't export an address blocker, a shipping & payment icons block, or a static content block.

Steps:

1. From your Shopify admin, click Sales channels > Checkout Blocks.
2. Click Blocks.
3. Click the name of the block that you want to export.
4. Click More actions ⌄ > Export.

The block is downloaded as a .json to your local device.

Import a block

You can create a block from an exported JSON file. If you choose to select the type of block before importing, then the type of JSON file must match the type of block you're trying to create. For example, when creating a line item content block, you can successfully upload only a line item content JSON file. Trying to upload a line item edit JSON file returns an error.

Note

You can't import an address blocker, a shipping & payment icons block, or a static content block.

Steps:

1. From your Shopify admin, click Sales channels > Checkout Blocks.
2. Click Blocks.
3. Click Create block.
4. Do any of the following actions:
   • Click Import from template.
   • Select the type of block that you want to import, and then click Import block.
5. In the Import block dialog, upload your discount JSON file:
   1. Click Add file.
   2. Select the appropriate JSON file.
   3. Click Import and continue.
6. Review the preloaded block configuration. Modify it as needed.
7. Click Save.

Delete a block

You can delete a block when you no longer need it. Deleting a block also deletes any existing analytics associated with the block. Deleting a block can't be undone.

Depending on the type of block, you can delete a block from the Blocks list of the Checkout Blocks app or from the checkout and accounts editor directly.

The address blocker can be deleted from the Checkout Blocks app's Settings by clicking Remove group.

Steps:

From Checkout Blocks

The following steps apply when you want to delete a custom field block, dynamic content block, line item edit block, or line item content block:

1. From your Shopify admin, click Sales channels > Checkout Blocks.
2. Click Blocks.
3. Click the name of the block that you want to delete.
4. Click More actions ⌄ > Delete.
5. In the Delete? dialog, click Delete block.

From Checkout and accounts editor

The following steps apply when you want to delete a shipping & payment icons block or a static content block:

1. From your Shopify admin, click Settings > Checkout.
2. In the Configurations section, click Customize on the checkout configuration with the block that you want to delete.
3. In the checkout and accounts editor, click the app block that you want to delete.
4. Click Remove app block.
5. Click Save.

Preview a block in the checkout and accounts editor

In the checkout and accounts editor, you can use the Preview block id (For testing purposes) field in certain block types to bypass dynamic display rules and preview specific blocks that you create.

Every custom field, dynamic content, line item edit, and line item content block that you create with at least 1 display rule has an associated preview ID. A preview ID is a long string of numbers and letters unique to the block that you create.

Caution

You must remove any preview IDs from the Preview block id (For testing purposes) field in the checkout and accounts editor before saving your checkout configuration. Preview IDs override display rules and always display the referenced block in a live checkout.

Steps:

1. From your Shopify admin, click Sales channels > Checkout Blocks.
2. Click Blocks.
3. Click the name of the block that you want to preview.
4. Click More actions ⌄ > Add to checkout.
5. Make note of the App block ID associated with this block. In the Preview block id section, click the clipboard icon to copy the block's unique preview ID.
6. Select your desired checkout configuration profile, and then click Open editor.
7. In the checkout and accounts editor, do any of the following:
   • If you haven't added the appropriate checkout block, then click ⊕ Add app block to add the required block type to your checkout.
   • If you have added the appropriate checkout block, then click the block to open the block settings.
8. In the App block settings, ensure that the App Block ID matches the app block ID for the block you want to preview.
9. In the Preview block id (For testing purposes) field, paste the block's preview ID from your clipboard.

The block displays in the checkout and accounts editor in the location you've set, regardless of any display rules. Be sure to remove the preview ID from the Preview block id (For testing purposes) field before saving your checkout.