Skip to main content
Checkout Code Blocks lets approved custom HTML, CSS, and JavaScript render in specific areas of hosted checkout.
Find this module in Shopify Stores > Edit Checkout > Advanced.
Custom JavaScript runs on checkout and can interact with page content. Only add code that has been reviewed and approved.

​
How it works

Use this module only for reviewed snippets that cannot be configured through normal modules. Each placement has its own enabled switch and editor.

​
Settings reference

You will set: Placement editorReplaces the standard checkout header when enabled.
You will set: Placement editorRenders custom content above express checkout buttons.
You will set: Placement editorRenders custom content in the order summary column before the cart.
You will set: Placement editorRenders custom content in the order summary column after the cart.
You will set: Placement editorRenders custom content below the payment button.
You will set: Placement editorRenders custom content on the thank-you page after the confirmation block.
You will set: Placement editorMounts custom content at the end of the checkout body after page load.
You will set: On/off switchTurns a placement on or off. You can save code while disabled for review.
You will set: Code editorThe HTML editor for the selected placement. It can include HTML, style, and script tags when approved.

​
Examples

Use After payment button for a small reviewed trust badge or reassurance snippet.

​
Before saving

  • Review code before enabling it.
  • Keep snippets small and placement-specific.
  • Preview checkout after every code change.
  • Do not duplicate pixels or analytics already configured elsewhere.

Pixels

Manage conversion pixels, URL matching, default behavior, and event filters.

GTM Events

Configure GTM container IDs, standard dataLayer events, and custom page-load events.

Attribution

Configure Hyros and WeTracked attribution scripts.