Facebook Pixel Tracking Overview for GTM and Shopify

In this session let’s cover how to test your FB pixel, audience creation, and Shopify vs. GTM setup.

Brad Redding:

Now that we’ve learned all about ad words tagging, implementing remarketing tags, implementing conversion tags, pulling all of those conversions out of your ad words data, applying them to your Google analytics events to really see where you can start pulling the lever on different campaigns and campaign budgeting. Now we’re going to look at Facebook and really the idea behind Facebook tagging is very similar in the philosophy that we’re looking at, our ad words remarketing tags. The goal is to really send as much data as we can to Facebook across all of our different events. Whether you are utilizing those events for audience creation today or in the future, it’s there. You can start implementing very rich and robust remarketing campaigns to the right audiences. This overview is going to cover three fairly broad topics when it comes to Facebook tagging on your Shopify store.

First, we’re going to look at how to test, how to test your Facebook pixel implementation. Next, we’re going to talk a little bit about audience creation. Since we went through a lot of the process and ad words, we’re going to go through some of the similar intricacies of Facebook and how to create different rules to really refine your audiences that you can apply to your different campaigns. Lastly, we’re going to look at Shopify versus Google tag manager when it comes to implementing your Facebook pixel and all of the different custom events across your site.

Let’s get started, and let’s look at how to test our Facebook pixel that runs onsite. Chances are you have the Facebook pixel helper already implemented on your site, and you may have even used it for your own site, just going through it page-by-page to verify that your different events are firing where and when with the appropriate data that you expect. Just like other pixel helper Chrome extensions, we simply enable it. This is looking at a product page, we can see the custom parameters that are sent along with our page view. And as we browse around the site and interacts with the different pages and our big pages, like our homepage category pages, product pages, add to cart, etc., we’ll see that this Facebook pixel helper is going to continue to update.

Now, one caveat here, if you have a headless site or you have some sort of PWA, than these pixel helpers aren’t always the best source of truth because they’re not always going to update. They’re really relying on a true page view refresh, where PWAs and headless sites they’re more virtual page views, as the site’s really preloaded on the first time we’re loading up the site. Keep that in mind, if you are testing on a headless site or a PWA, the Facebook pixel helper won’t really be the biggest help and the best help for you in verifying your Facebook pixel tag. You’ll have to refer to the previous training on how to QA, how to properly QA your tags, where we went through the network panel example, where we can actually start filtering for the different Facebook events as we’re going through page-by-page, and we can actually see what’s firing when and what data it contains.

The other option you have to test your Facebook pixel, is inside of your business manager you can actually navigate to your pixel, go to your test events, enter the URL for your site and then, you can actually start navigating through your site on a page-by-page basis. This will actually start triggering the events that you are triggering and you are actually loading, whether it’s a page view, whether it’s add to cart, if you’re triggering a page view or some sort of custom event, it’ll start to load here in your real-time activity. This is a really great way to go through and validate. If you’re worried about a particular page or a particular action, like an add to cart, this will help you validate on your own if you struggle with the pixel manager. Again, I would recommend going back through our how to QA your tags training, as we go more in depth into network panel on really how this works.

Now, let’s look at our audiences. Within Facebook, like we talked about, we have some standard events here that you’re going to see whether it’s the Shopify, Facebook implementation or your implementation through Google tag manager, such as product views. Our product view is going to contain potentially some unique parameter data like our product name, our product category, or skew content type, etc. If we look at our initiate checkout, the initiate checkout is going to contain some other data. It’s also going to contain our product ID, potentially the total cart value, etc. These parameters that we’re attaching to the Facebook tag, are ultimately available for you to start pulling into custom audiences.

This is the custom audience builder within the Facebook business manager, and you can see very simply, you have options to select your different events. Whether it’s page view or URL based, or if you want to start pulling your specific events, like your view content, your add to cart, initiate checkout. At that point, you can start refining your add to cart by a URL or parameter. An example here is if you want it to pull all add to carts, if you had a quick view on a collection page, then you could do URL contains collections, assuming your collection page has collections in the URL. Otherwise, you can actually start pulling in your different parameters here, like content category, content IDs, content name, and start filtering down based on the product name or the other parameter that you’re selecting.

Let’s just say we had hair gel as a concept name. We can go through the process of creating an audience here. The UI is a little bit different than when we looked at in ad words, but the concept is really the same. You can combine different rules, whether it’s a URL, a parameter, we can do and or or conditions, we can do an add to cart contains hair gel, or we can look at a view content contains hair gel or view content contains whatever else you might want to match with that. You really have the flexibility to go through and combine your unique product data sets, or your unique behavior on site and pull that into audiences. I’ve really focused on the standard events here, like the product views and the add to cart, but we’ll be going through more advanced event tracking where you can push custom event data, custom parameter data into Facebook that you can then pull into audience creation. We’ll go through a quiz example where you can push custom database on quiz answers into Facebook, pull that into an audience, and then you can create very highly targeted or curated campaigns or retargeting campaigns based on what people had gone through on a quiz.

That’s a very general basic introduction to audience creation within Facebook. We’re not going to go through saved audiences or look like audiences, but since we looked at the similar to audiences within the ad words UI, the look alike audiences, you are likely familiar with what those are and how they work within Facebook. They’re really going to leverage a lot of what you are potentially feeding Facebook in terms of standard event data and your custom event data.

Now let’s take a look at the Shopify versus GTM comparison for implementing your Facebook pixel and all the standard events. Just taking a look here at our test store. First, let’s talk about the Shopify/Facebook integration. What are the pros of that? It takes about two seconds. If we go to our preferences section, grab our Facebook pixel ID, enter it here, save. And now we have very robust Facebook pixel implementation on our Shopify store that covers our major events; things like our view products, our add to cart, our purchases, are page views. Those are all going to largely come through out of the box without you having to do anything.

The other benefit to implementing Facebook through Shopify is, I would say, based on what we’ve seen over our years in managing different sites and different GTM accounts and coming in when there are fire drills, it’s usually less prone to things just magically breaking or breaking without you know it. Whether it’s a purchase tag breaking or a page view tag breaking, if you’re implementing it through a Shopify backend, I would say you’re less likely to have that random outage. Not that GTM is going to inherently break your Facebook pixel tracking, but it’s just prone to potentially having your GTM code overwritten or removed by deployment by accident. And if that happens, then your Facebook tracking would drop off. Those three benefits, I would say, looking at our Shopify/Facebook pixel implementation, you can get up and running in seconds. You have your standard, major events done and done for you. I would say you’re less prone to major outages.

Now let’s flip and look at GTM and our Facebook/GTM implementation, and what are the benefits to that? One thing that we look at with our standard Facebook implementation, is you’re pretty much in a box with the events that you are able to send in your standard events and the data that is attached to that standard event. For example, as you know, within your Shopify catalog, you have skew, product ID, varian ID, a few other combination of those IDs. If you had a product catalog inside of Facebook that was using skew as a primary product ID, then you’re out of the box Facebook view content product ID would not match.

By default, Shopify is using product ID, and this is what you’d have to match to your Facebook catalog. The other thing that we see with Shopify versus GTM when implementing Facebook, is when we look at the standard events, is you don’t have the ability to enrich or change some of the custom parameters, especially around checkout. Let’s take a look at standard Shopify implementation and the initiate checkout event. Our initiate checkout event, we have out content type, content IDs, value, number of items and currency.

Now let’s take a look at implementation with Google tag manager, where I can see where we are able to get a bit more robust in the product data that we’re sending with the initiate checkout event. And this will really carry through all the way into the checkout and purchase thank you page event that we’re sending as well, where you’re able to customize the ID. You can send additional parameters or attributes. You’re able to send your quantity per item versus just the total number of items in the cart, if you wanted to attach more to this, you could. If you wanted to send a color or size or any other attribute unique to a product, you’re able to do that If you’re implementing Facebook through Google tag manager.

If we look at how that is set up here within GTM, again, these are basic parameters where you have your contents, which is referring to a custom variable that we’ve created, our content type currency value. The content here, if we just take a look at this data layer variable that we’ve created, we can see we are pulling the entire checkout products data layer. This object that we’ve set inside of the checkout dot liquid data layer, we’re then returning the parameters that we’d want to pass for every product that’s included in checkout.

Like I was saying, if you wanted to add in color, and let’s say you had color set in your data layer, you could add that. Let’s say you had a style number and that was set in a data layer, you could attach that with a product. If the data exists in a data layer and you want that to be sent with every product with your Facebook, in this example, initiate checkout hit, you have full control over doing that. It’s very easy to implement like I’ve just shown.

Continuing on to our purchase process, one of the other big things that we’ve seen grow over the last year, is manual advanced matching.Basically, what this is allowing you to do, is to send customer data or hashed customer data like email, phone number, first name, last name, location, etc., pass that into Facebook, and then Facebook is going to use that to help improve their matching capabilities to find similar, look like audiences. The more data that you’re able to feed Facebook, in this case your purchases, you can then benefit off of potentially more robust and more profitable look alike audiences.

Just popping back over here to our checkout, thank you scripts, where we have the data layer and we have our customer, so some of those customer data that’s attached to the order, this can be either sent to Facebook or hashed and sent to Facebook. This will enable you to really push that manual events matching to a very high percentage that will likely benefit your look like audience creation. If you wanted to do something like this while you kept the native Shopify Facebook pixel implantation live, then you would have to send a second event. Instead of just relying on this standard purchase event that is being sent from Shopify to Facebook, you would have to send second purchase. Instead of being a standard track, we could send a track custom, and it could be purchase advanced matching or something similar to that.

The track custom, this allows you and Facebook, and we’ll go through this as we get into more of the custom event tracking that we’re pushing to Facebook, this is a way that you could in theory, send an additional event that contain your advanced matching data, while you kept the Shopify/Facebook implementation live.

Something that’s likely to grow in 2020 and beyond, is consent. Another area that I would say GTM has a leg up on the Shopify/Facebook pixel implementation, is the ability to add some sort of consent. If someone’s browsing your site and you are not able to fire a Facebook pixel or any of the Facebook events until somebody opts in and says, yes, whether that’s for GDPR or the California Privacy Act or the next unnamed privacy act that comes out, with Google tag manager, you would be able to create a trigger inside of GTM. Instead of just simply attaching these Facebook events to our standard data layer events, we would also be able to add a rule that this could only fire if somebody had consented to yes, to opt into being pixeled. And then, we could X you on the transaction complete. That’s something that is, again, likely to grow. And with Google tag manager, you are able to really control. If you had to wrap a lot of privacy around your tagging and pixel implementations, you could do that with GTM.

That’s a quick background and overview on Facebook tracking. We looked at how to test with Facebook pixel helpers, briefly touched on the network panel and the built in Facebook pixel helper here, as you can browse your own site. We looked at audiences and audience creation and how we can apply that. We’re going to dig a little bit deeper into custom events and custom parameters that we can send in to your Facebook pixel account. Then, our Shopify versus GTM implementation and the pros and cons to both of those approaches.


(“Elevar”) is strongly committed to protecting and respecting your privacy rights.