How to install the Zoho PageSense snippet on Shopify | Help guide?

Install the PageSense snippet on Shopify

You can install the Zoho PageSense Tracking Code on your Shopify store to understand visitor behavior and measure how visitors interact with your website. To track storefront activity, add the Tracking Code to your Shopify theme. To track supported checkout events, configure a custom pixel using Shopify's Customer events settings. This article explains how to install the PageSense code on your Shopify storefront and configure a custom pixel for checkout event tracking.
NotesNote: Installing the Tracking Code in your storefront theme and configuring a custom pixel are two separate steps. Shopify custom pixels run in a sandbox and can access only the events and data supported by Shopify's customer events APIs.

Install the PageSense code on your Shopify storefront  

Add the PageSense Tracking Code to your Shopify theme to track visitor activity on the pages where the theme code runs.
Step 1: Open your Shopify theme
  1. Log in to your Shopify admin account.
  2. Go to Sales channels > Online Store.
  3. Locate your current theme and open its action menu.
  4. Select Edit code.
Step 2: Open the theme.liquid file
  1. In the theme code editor, locate the Layout folder.
  2. Select theme.liquid.
  3. Find the closing </head> tag in the file.

Step 3: Add the PageSense Tracking Code
  1. Copy the Tracking Code for your PageSense project.
  2. Paste the complete code immediately before the closing </head> tag in theme.liquid.
  3. Save your changes.

Important: If the PageSense Tracking Code is already installed in your theme, do not add it again. Duplicate installations can result in duplicate tracking.
Step 4: Verify the installation in PageSense
Return to your Zoho PageSense account and use the Verify Installation option to confirm that the Tracking Code has been installed successfully on your Shopify storefront.
 

The storefront installation is now complete. To track supported checkout events separately, continue with the custom pixel setup below.

Configure a custom pixel for checkout events  

Shopify provides a Customer events section where you can manage app pixels and custom pixels. You can use a custom pixel to subscribe to supported Shopify customer events and send the relevant tracking information to PageSense.
Step 1: Open Customer events
  1. In your Shopify admin, go to Settings.
  2. Select Customer events.
  3. Click Add custom pixel.
Step 2: Create the custom pixel
  1. Enter a name for your pixel, such as PageSense Checkout.
  2. Click Add pixel.
  3. Open the code editor for the newly created pixel.
Shopify may display a notice explaining that custom pixels require JavaScript knowledge and that you are responsible for code security, privacy compliance, troubleshooting, and maintenance.

Step 3: Add the PageSense tracking code
In the custom pixel code editor, add the code below. Replace the placeholders with the correct values from your PageSense project before saving.
  1. // Load the PageSense script.
  2. const pageSenseScript = document.createElement("script");
  3. pageSenseScript.type = "text/javascript";
  4. pageSenseScript.src = "<SNIPPET_SRC>";
  5. document.head.appendChild(pageSenseScript);

  7. // Track the checkout-started event.
  8. analytics.subscribe("checkout_started", (event) => {
  9.   window.pagesense = window.pagesense || [];
  10.   window.pagesense.push([
  11.     "trackEvent",
  12.     "<CHECKOUT-EVENT>"
  13.   ]);
  14. });

  1. // Track checkout completion and revenue.
  2. analytics.subscribe("checkout_completed", (event) => {
  3.   const checkout = event.data.checkout;
  4.   const checkoutTotalPrice = checkout.totalPrice?.amount;

  6.   window.pagesense = window.pagesense || [];
  7.   window.pagesense.push([
  8.     "trackRevenue",
  9.     "<REVENUE-GOAL-ID>",
  10.     checkoutTotalPrice * 100
  11.   ]);
  12. });
Replace the following placeholders:
  • <SNIPPET_SRC>: The PageSense script URL for your project.
  • <CHECKOUT-EVENT>: The event name configured for your PageSense custom event goal.
  • <REVENUE-GOAL-ID>: The ID of the PageSense revenue goal you want to update.
Step 4: Save and connect the pixel
  1. Review the code and confirm that all placeholders have been replaced.
  2. Click Save in the custom pixel editor.
  3. Follow Shopify's prompts to connect or enable the pixel.
  4. Use the available Shopify testing tools to verify that the pixel receives the expected customer events.

The custom pixel is configured. Continue to the verification steps below to check whether the required events are being recorded correctly.

 Verify event tracking  

After configuring the custom pixel, test the events you want to track.
Verify the checkout-started event  
  1. Open your storefront.
  2. Start a checkout using a supported test flow.
  3. Check whether Shopify reports the checkout_started event.
  4. Confirm that the corresponding custom event appears in PageSense, if the event mapping is supported by your integration.
Verify the checkout-completed event  
  1. Complete a test order using an appropriate test payment method.
  2. Check whether Shopify reports the checkout_completed event.
  3. Confirm that the revenue goal receives the expected value in PageSense.
  4. Compare the recorded value with the order total and verify the currency and amount format.
Event availability can vary depending on Shopify's checkout flow, pixel permissions, consent settings, and the data Shopify exposes to custom pixels.

Troubleshooting  

The PageSense code does not appear to run on my storefront
  • Confirm that the code is placed before the closing </head> tag in theme.liquid.
  • Make sure you saved the theme changes.
  • Check that the correct PageSense project's Tracking Code was installed.
  • Check for duplicate installations that could affect tracking.

The custom pixel does not receive checkout events
  • Confirm that the pixel has been saved and connected.
  • Verify that the event is supported by Shopify's customer events APIs.
  • Check Shopify's available pixel testing tools and consent settings.
  • Confirm that your test flow triggers the event you are trying to track.

PageSense does not record the custom event
  • Verify that <SNIPPET_SRC> was replaced with the correct script URL.
  • Confirm that <CHECKOUT-EVENT> matches the custom event goal configuration in PageSense.
  • Check whether the PageSense tracking methods used in the example are supported within the custom pixel's sandboxed environment.
  • Inspect the browser or pixel debugging output for errors.

The revenue value is incorrect
  • Confirm that the correct PageSense revenue goal ID is used.
  • Check the checkout total returned by Shopify.
  • Verify the currency and whether the goal expects a major or minor currency unit.
  • Review the multiplication by 100 in the sample code and adjust it if the expected format differs.

Checkout tracking differs from storefront tracking
Shopify custom pixels run in a sandbox and do not behave exactly like scripts installed directly in the theme. Some storefront data, browser APIs, and checkout interactions may not be available in the pixel environment. Verify that the events and tracking methods you need are supported before relying on the data for reporting.

 




We’ve designed this documentation to guide you every step of the way. If you need further assistance or have any questions, don’t hesitate to contact us at support@zohopagesense.com - we’re always here to help!