If you're using advanced page builders like Replo, Zipify, or GemPages for your Shopify store, you'll need to take extra steps to ensure Heatmap.com tracks all your pages correctly.
This guide will help you integrate Heatmap.com with these popular Shopify page builders.
Why Additional Setup is Needed
These page builders often create pages outside of Shopify's standard theme structure. As a result, the default Heatmap.com Shopify installation might not capture data from these custom-built pages, unless there's a script added to these additional pages.
Accessing your Heatmap Tracking Code Snippet & Heatmap Conversion Code Snippets:
In order to access your tracking code snippet, you can follow these steps:
Go to the Settings tab within your portal.
Click "Snippet"
Here you will see the code available to copy on your page builder pages.
theme.liquid file is the Heatmap Tracking Code Snippet for Sessions
Installing Your Heatmap Tracking Code Snippet on Specific Page Builders
Replo
Open Your Replo Dashboard
From the sidebar, go to "All Pages".
Choose the specific page where you want to add the snippet.
⚠️ Note: If you’re on a blog post, product template, or section, the Settings tab will not appear.
With a page selected, click on the Settings > Advanced.
Scroll to the "Custom Page Head" section.
Paste your Heatmap tracking snippet into the field provided.
Click "Publish" to save and apply your changes.
Zipify Pages
1. In your Shopify admin, go to "Apps" > "Zipify Pages".
2. Navigate to "Settings" > "Tracking".
3. Find the "Header Code" section.
4. Add your Heatmap.com tracking code.
5. Click "Save" to apply the changes.
GemPages
1. Open the GemPages editor.
2. Click on "Settings" in the left sidebar.
3. Select the "Custom Code" tab.
4. In the "Header" section, paste your Heatmap.com tracking code.
5. Click "Save" to apply the changes.
PageFly
Log in to your PageFly dashboard.
Click on the Custom Code Editor (8th icon on the left toolbar).
Locate the Custom CSS and Custom JavaScript sections.
Paste your heatmap.com tracking code in the Custom JavaScript section.
The changes will be saved automatically.
Snippet Installation Verification
After installation and official verification on the heatmap platform, wait about 12 hours for data to start appearing in your heatmap dashboard.
To verify your snippet:
Log in to your Heatmap.com account and go to the Settings tab within your portal.
Click "Snippet"
Click the "Verify My Snippet" button in the bottom right corner.
You'll receive a pop-up validating if the snippet was installed correctly. If you don't see any data after 24 hours or believe there is a data collection issue, double-check that both snippets are correctly installed.
Troubleshooting
If you're not seeing data for pages created with your page builder:
Ensure you've added the code to both your Shopify theme and the page builder settings.
Check if your page builder has a caching system and clear it if necessary.
Verify that you're using the correct tracking code for your Heatmap.com account.
Need More Help?
If you're using a different Shopify page builder or encountering issues, please contact our support team at support@heatmap.com. Provide details about your page builder and Shopify setup for faster assistance.