Skip to main content
Use this guide if your store uses Shopify’s checkout. If it doesn’t, follow the Custom guide.
Headless storefront? Use this guide too. Only step 1 is different. Pick the Headless storefront tab there. Steps 2 to 4 are the same, because checkout still runs on Shopify.

​
What you’ll set up

​
Before you start

Go to Settings → Northbeam Pixel and Event Tracking. Every script in this guide is there, already filled in with your Client ID:

​
1. Install the Northbeam Pixel and Metadata Script

These scripts run on every page of your storefront. The Northbeam Pixel records visits, where visitors came from, and the pages they view. The Metadata Script records your store’s region and currency. Where they go depends on your storefront:
1

Open your theme code

In Shopify, go to Online Store → Themes. Click ⋮ → Edit code.
The ⋮ menu next to your current theme, with Edit code highlighted
2

Paste both scripts in the head

Open Layout → theme.liquid and find the <head> section. Paste the Metadata Script first, then the Northbeam Pixel directly below it.
Metadata Script and Northbeam Pixel pasted at the top of the head section in theme.liquid
3

Save

Click Save.

​
2. Set up the Northbeam Custom Pixel

Shopify’s checkout doesn’t run your theme, so the pixel from step 1 can’t see it. The Custom Pixel covers checkout instead. It records the checkout pages customers view and tracks completed purchases using Shopify’s checkout_completed event.
1

Add a custom pixel

In Shopify, go to Settings → Customer events. Open the Custom pixels tab and click Add custom pixel.
Customer events, Custom pixels tab, and the Add custom pixel button
2

Name it

Name the pixel Northbeam Event Tracking, then click Add pixel.
Naming the custom pixel
3

Set permission and paste the script

Set Permission to Data collected does not qualify as data sale. Paste the firePurchaseEvent script from Northbeam into the code editor, then click Save.
Setting the permission, pasting the script, and saving
4

Connect it

Click Connect, then click Connect again to confirm.
Connect button for the custom pixel
Confirming the pixel connection
5

Check your cookie banner

Go to Settings → Customer privacy and confirm a cookie consent banner is turned on. Without one, customers can’t opt in to tracking, and the Custom Pixel may not run.
Shopify Customer Privacy settings

​
3. Add post-purchase tracking (optional)

Skip this step unless your store shows a post-purchase upsell page after checkout. This script lets Northbeam attribute those extra purchases.
1

Open checkout settings

In Shopify, go to Settings → Checkout.
Shopify Checkout settings
2

Paste the post-purchase script

Scroll to Post-purchase page. Paste the Northbeam post-purchase script into Additional scripts, then click Save.
Additional Scripts field on the Post-Purchase Page

​
4. Let Northbeam know

When your scripts are installed, submit a support ticket to tell our team. We’ll finish your setup so page views are tracked correctly.
Don’t skip this step. If we don’t hear from you, page view tracking may be incorrect. Page views are the foundation of Northbeam’s tracking, so attribution can be incomplete without them.

​
Test your setup

Check that you have:
  • The Metadata Script and Northbeam Pixel in the <head> of your storefront, in that order (in theme.liquid for standard themes)
  • The Northbeam Custom Pixel connected under Customer events → Custom pixels
  • The post-purchase script in your checkout settings (only if you use a post-purchase upsell)
Then test that the pixel is firing.

​
Optional tracking

Add these only if they apply to your store.

Custom Goals

Track other actions, like sign-ups, add-to-carts, or form submissions.

Page View Events

Only for headless storefronts that are single-page apps (for example, Hydrogen). Most stores don’t need this.

​
FAQ

After setup, you’ll see two Northbeam entries under Settings → Customer events. This is expected. They’re not duplicates, and you need both.Don’t delete either one. You don’t need to change any settings on the App Pixel.
Check both tabs under Settings → Customer events.
For example, an external order management system sends your orders to Northbeam through the Orders API instead of the Shopify connector. Follow this guide as normal, but change one line in the Custom Pixel. See Shopify + Custom.
Standard Shopify themes: no. Install the scripts directly in Shopify using the steps above.Headless storefronts: you can add the Northbeam Pixel to your storefront through Google Tag Manager (see the Headless tab in step 1). Steps 2 and 3 are always done in Shopify.