How to Install the Snapchat Tracking Pixel on Shopify and Magento: A Step-By-Step Guide

With Snapchat’s release of its tracking pixel, what used to be a mere picture sharing app has evolved into a competitive performance advertising platform. This launch allows Snapchat advertising campaigns to be optimized and analyzed for better performance by tracking and monitoring how users are interacting with your ads outside of the app.

The Snapchat Pixel is the latest development in Snap Inc’s direct response advertising efforts for eCommerce and app-based advertisers. It is a snippet of code that delivers meaningful feedback about users who interact with their ad.

Keep reading to learn more about the Snapchat Pixel and how you can install Snapchat’s conversion tracking on your Magento or Shopify eCommerce site.

What is the Snapchat pixel?

The Snapchat pixel is a Javascript code placed on the backend of your website that tracks the actions of users who see your ad. The pixel allows advertisers to implement highly-targeted campaigns and analyze how these campaigns perform with consumers across different devices.

This new feature allows you to track specific actions on your ads, create custom audience lists to run campaigns, and measure your goals beyond what happens during a single session or on a single device (limitations of most analytics platforms such as Google Analytics).

This will allow you to better track eCommerce purchases and other conversions driven by your Snapchat ads across devices and browsers.

Why is the Snapchat pixel important?

The pixel is part of Snapchat’s performance-based advertising model geared towards advertisers receiving real-time feedback on their ads. With the new conversion tracking pixel, Snapchat is positioning its app as a viable advertising platform, similar to platforms like Instagram and Facebook.

The pixel allows marketers to track and analyze campaign data in real time within 28 days after a user has engaged with an ad. Advertisers will be able to see which ads are successful and use that information to create more fine-tuned campaigns.

Because of this, the pixel is a great tool for driving conversions and direct response goals overall, measuring responses over multiple sessions and devices.

How does the Snapchat pixel work?

The pixel is a Javascript tag that hashes all data using privacy-friendly SHA256 and sends it back to Snapchat’s advertising platform. Whenever a conversion event is completed by a user a small snippet of javascript or an image tag reports back to the advertising platform.

The Pixel captures data for Self Service Ad Formats, such as Filters and Snap Ads. You can use the same Pixel across multiple websites; however, you can only create one Pixel ID per ad account.

Once the base pixel is set up on your website you can also implement the available conversion parameters (purchase value, currency, quantity etc.), so they can be used in reporting and optimizations down the road.

Unlike Google Ads and Facebook advertising platforms that report events based on the date of the last click or view, conversion events are reported on the day it took place. The default post-swipe attribution window is 28 days, while the post-view attribution window is 1 day. However, these windows are flexible:

_{Image Provided by Snapchat Business Centre}

While the current feature set is limited, upcoming developments for Snapchat’s pixel tracking include remarketing technology, with each page featuring the pixel having the ability to backfill audiences. Another feature on Snapchat’s roadmap is the ability to support audience building, specific measurement metrics based on URL matches, and other rules.

How to Install the Snapchat Pixel

Step 1: Sign Up for Snap Pixel

a) Start by logging into your Snapchat Ads Manager. In the top navigation, select the “Snap Pixel” option under “Manage”.

b) Select “Create my Snap Pixel”.

c) Select “Set Up My Snap Pixel”. This will trigger a pop-up that includes the pixel’s code.

d) Copy the pixel’s code found in the pop-up, and add it to your website’s header tag. The code used throughout the images in this article are examples of a specific implementation and will not work for other purposes.

_{Images Provided by Snapchat Business Centre}

Step 2: Configuring Attribute Website Actions

Events Attribution:

To attribute website actions for Snapchat users, the pixel uses phone numbers, email, or mobile ad IDs. One of the following parameters must be provided if users are logged in to your website(s). If the parameter is not defined then you can leave it empty.

These values will be hashed automatically using the SHA 256 algorithm, so there is no need to hash it yourself.

User Parameter	Description
user_email	email (e.g. @email)
user_phone_number	only digits with country code, area code and number. No other formatting characters like -,(,) (e.g. 13101234567)
user_mobile_ad_id	mobile ad id, i.e. IDFA (e.g. AEBE52E7-03EE-455A-B3C4-E57283966239)
user_hashed_email	sha256 hash of lower cased user email
user_hashed_phone_number	sha256 hash of user phone number
user_hashed_mobile_ad_id	sha256 hash of lower cased user mobile ad id

Standard Event Types:

There are many predefined event types that are compatible with the Snapchat pixel:

Event Type	Description
PURCHASE	Track purchases and revenue
SAVE	Track add to wishlist events on specific items
START_CHECKOUT	Track checkout events
ADD_CART	Track add to cart events on specific items
VIEW_CONTENT	Track content view events
ADD_BILLING	Track payment info configuration status
SIGN_UP	Track user registration methods
SEARCH	Track search events
PAGE_VIEW	Track web page views

Optional Event Parameters:

Every event can have the following optional parameters. Note that these parameters are not yet supported for reporting.

Event Parameter	Description	Value
price	Value of the purchase	float
currency	Standard ISO 4217 code, e.g., EUR, USD, JPY	string
item_ids	International Article Number (EAN) when applicable, or other product or category identifier	Array of strings
item_category	category or category group	string
transaction_id	Transaction or order id	string
Description	A string description for additional info	string
search_string	The text that was searched	string
number_items	Number of items	int
payment_info_available	1 for yes, 0 for no	1 or 0
sing_up_method	Facebook, Email, Twitter, etc	string
success	1 for yes, 0 for no	1 or 0

Tracking Snapchat Purchase Conversion Value in Magento

You can receive valuable, real-time information about users’ purchases on your Magento website by tracking Snapchat purchase conversion rates.

Follow these instructions to embed the Snapchat purchase conversion script:

Preparing Pages

• On your transaction success page (commonly ending in ‘checkout/onepage/success/’) ensure you have your base SnapChat Pixel code firing with at least one user parameter such as email or phone number
• Fire the Snapchat purchase conversion event script below after your base pixel

Code:

<?php
$orderId = Mage::getSingleton('checkout/session')->getLastOrderId();
$order = Mage::getModel('sales/order')->load($orderId);
$total = (float)number_format($order()->getSubtotal(),2);
?>
<script>
snaptr('track', 'PURCHASE', {'currency': 'USD', 'price': <?php echo $total?>, 'transaction_id':'1<?php echo $orderId>' });
</script>

Tracking Snapchat Purchase Conversion Value in Shopify

If you’re on a Shopify website and do not want to touch the website code, Snapchat has released The Snapchat Ads App which makes it easier to create ads and set-up campaigns on shopify without needing to edit the website code directly. For those that want to manually add the conversion tracking script to your Shopify store you can add the following tracking code to the back end of your site.

Embed the Snapchat tracking script by following these instructions.

• Prepare Pages
• From your Shopify admin, click Settings, and then click Checkout.
• In the Order processing section, find the Additional scripts text box
• Paste your tracking code in this box
• If there is already code in this box, paste your tracking code after it. Be sure to insert your pixel id into the string:

[ snaptr('init', 'XXXXXXXXXXXXXXXX', ]

Code:

{% if first_time_accessed %}
<script type='text/javascript'>
(function(win, doc, sdk_url){  if(win.snaptr) return; var tr=win.snaptr=function(){
tr.handleRequest? tr.handleRequest.apply(tr, arguments):tr.queue.push(arguments);};  tr.queue = []; var s='script';  var new_script_section=doc.createElement(s);  new_script_section.async=!0;  new_script_section.src=sdk_url;  var insert_pos=doc.getElementsByTagName(s)[0];  insert_pos.parentNode.insertBefore(new_script_section, insert_pos); })(window, document, 'https://sc-static.net/scevent.min.js'); snaptr('init', 'XXXXXXXXXXXXXXXX', {  'user_email': {{customer.email}}' }); snaptr('track', 'PURCHASE', {'currency': 'USD', 'price': {{ total_price | money_without_currency }}, 'transaction_id':'{ {checkout.order_id }}' }); </script>
{% endif %}

Whether you’re on Magento or Shopify, It’s a good idea to have a trained developer present when installing this code to ensure you don’t run into any problems and the code is compatible with your specific theme and site.

Tracking Snapchat Add to Cart Events in Shopify

Once you have assured that your pixel is correctly firing on all your pages, you can also track “Add to Cart” events in Shopify. Embed this Snapchat tracking script by following these steps:

1. Log in to your Shopify admin page, select “Online Store” on the left navigation panel, and select “Themes”.
2. Within the “Actions” drop-down menu, select “Edit Code”
3. Locate your cart.liquid file and paste the following event code:*

<script type="text/javascript">
snaptr('track', 'ADD_CART', {
'currency': '{{shop.currency}}',
'price': {{ cart.total_price | money_without_currency | remove: ',' }},
'item_ids': [{% for item in cart.items %}'{{ item.variant.id }}'{% unless forloop.last %}, {% endunless %}{% endfor %}],
});
</script>

*Always ensure to test any code edits on your website before pushing changes live.

Step 3: Associate the Pixel with Desired Ads

At this point, you have attached the Snap Pixel to your ad account and to your websites.

When creating an Ad Set, ensure the Snap Pixel toggle is set to “Attached” under “Ad Set Details”. This will allow you to receive conversion reporting for ads. You can also enable this for active ad sets you have made in the past.

_{Image Provided by Snapchat Business Centre}

Step 4: Check Your Pixel Is Correctly Installed

Once the Pixel has been installed, you can check its activity on the “Ads Manager”.

In the top navigation panel of “Ads Manager”, select “Snap Pixel” in the “Resources” tab. This is how you verify which domains the Pixel was placed on, and its event types.

This is also where you can monitor if events are firing correctly. However, keep in mind that activity statistics are not currently able to be exported.

Snapchat has also created a pixel helper tool that lets you test the pages your pixel is integrated with.

_{Image Provided by Snapchat Business Centre}

Step 5: Launch Campaigns

You will see real-time conversion reports in the “Ad Dashboard”. You can select single conversion metrics in the “Customize Column” to include them in the report. Press Save.

_{Image Provided by Snapchat Business Centre}

For more information, visit the Snapchat Business Centre here.

Pixel tracking is an important part of Snapchat’s developing performance advertising portfolio, introducing measurement solutions advertisers have started to expect. While pixel tracking will introduce many new features related to the pixel, some of the most important for advertisers will be cross-device reporting and buying optimization options; by integrating the Snapchat pixel now, you will be able to hit the ground running as new features are released.

Maximize Your Advertising Results

Northern Commerce strives to utilize the newest and most advanced marketing platforms for our clients. Snapchat Advertising is one of many tools we use to help clients target their audience, create eye-catching content, and maximize results.

Learn more about Northern’s advertising solutions.