Custom Web Pixel for dual tagging

Why do I need Littledata's Custom Web Pixel?

Custom web pixels are additional code snippets, added from within the Shopify admin settings, that enhance event tracking across your online store. When added in addition to Littledata's server-side tracking they allow for fully redundant tracking in destinations that support client and server side events. Supported destinations include:

• Meta Pixel
• TikTok
• Pinterest

Adding Littledata's custom web pixel gives you another reliable way to track events that might otherwise be lost, and follows the best practice for a Redundant Setup.

note:

This feature is available only for Pro, Plus and Enterprise customers.

What events are collected by the web pixel?

Littledata's custom web pixel improves tracking of checkout and post-purchase events across Social bundle integrations (Meta Conversions API or Mea CAPI for short, TikTok and Pinterest).

Data destinations	Web pixel event	Meta event	Description
Meta CAPI, TikTok, Pinterest	product_added_to_cart	AddToCart	The addition of an item to a shopping cart
Meta CAPI, TikTok	checkout_started	InitiateCheckout *	The start of a checkout process
Meta CAPI, TikTok	payment_info_submited	AddPaymentInfo *	Customer payment info submitted
Meta CAPI, TikTok, Pinterest	checkout_completed	Purchase *	Completing the checkout / thank you page

* an additional PageView will be sent with the event

How to add the web pixel

1. In the Littledata dashboard you will see the custom web pixel status; if you haven't used the Littledata web pixel before, the state should direct you to update the web pixel. You will be redirected to the custom web pixel installation wizard

2. From your store admin page, go to Settings, then Customer events

3. You will need to create a custom pixel called Littledata - Advanced tracking . Make sure that the name is exactly the one provided so we can check this step is complete.

4. Configure your customer privacy settings.

If the Consent Management Platform or cookie banner you're using integrates with Shopify's Customer Privacy API then keep to Required; if it doesn't or you are not using any consent management you can set the permission to Not required.

5. Return to the Littledata app, copy the Custom Pixel code and paste it into your newly created pixel under the Code section. After that, Save and Connect.

When the setup is completed, you will be redirected to the Littledata dashboard where the Custom Web Pixel state should be green, informing you that the pixel is detected on the store.

Custom web pixel dashboard states

We run periodic checks to ensure that both the tracking script (via the app embed) and the custom web pixel are detected on your store.

1. Custom web pixel detected
   The Littledata custom web pixel is detected and running on your store.

   

2. Missing custom web pixel
   We've failed to detect the Littledata web pixel on your store; follow the guide to re-enable it by clicking FIX THIS. Make sure the pixel is named Littledata - Advanced tracking.

   

3. Custom web pixel available
   You didn't connect Littledata's web pixel before or updates to the web pixel are available

   

Troubleshooting

How to check if the web pixel has loaded

Go to your newly created pixel —Littledata - Advanced tracking— in the Customer events tab and click on test to open the custom pixel on your website.

To view which events are loading, visit each page that you want to test the pixel for, and review the Pixel helper dialog to ensure that the event was successfully subscribed to and that the callback function was successful.

How to reconnect the pixel

If you don't see the pixel firing, one of your colleagues may have disconned the pixel. You need to go to your Shopify Customer events, check for the Littledata - Advanced Tracking, click on the three dots on the right and click Connect. That's it! However, if the web pixel is not there, it means that it has been deleted, and you will need to install again.