Yuma 4×4

Media and Communications

How to install the Facebook Retargeting Pixel with GTM (2018): Part 1

How to install the Facebook Retargeting Pixel with GTM (2018): Part 1


– In this video series,
we’re going to take a look at how to install the Facebook Pixel with the help of Google Tag
Manager onto your website. All and more coming up right after this. (groovy music) Hey there, welcome back to another video of magic school that I’m teaching you the data-driven way of digital marketing. My name is Julian, and on this channel we do marketing tech reviews,
tips and tricks videos, and tutorials just like this one. So if you haven’t yet,
consider subscribing. Now it’s 2018 and
technology’s always changing, so today we want to do an update video on our very popular Facebook Pixel videos, and how to install them with
the help of Google Tag Manager. And in this first video,
we’re going to take a look at how to deploy the
Facebook based tracking Pixel so we can capture page views
with this Facebook Pixel. I usually do this with Google Tag Manager, because it gives me great flexibility to deploy more sophisticated tracking, which we will do in the
next videos after that. So without further ado, let’s dive in. Alright, in our Facebook account, we are here under the Pixel settings, which you can easily reach
by going to the menu here. And under Events Manager, you
have your Pixels right here. Now this is an overview,
click into your Pixel, and then you have the
overview of your activity. From here you can view
what events were fired, and also debug if anything
is coming into the Pixel. In order to set everything up, you need to click on
the sestup button here, and we’ll give you options to install this via integration or Tag Manager to manually install or
send this to a developer. And although it says here Tag Manager, I will go with the manual installation because what this option will do is install a template into
your tag manager account and won’t give You much control over the customizations of the code. So since we want to understand it, we will go with the manual installation and this little overview will give us a little bit of an explanation. You can ignore the first part, because we are deploying this
through Google Tag Manager. And then we’ll get to our
base tracking Pixel code. Now this is a code that we can copy just by clicking on it
and start installing it with the help of Google Tag Mention. Now this is my demo shop where I want to install the Facebook Pixel I have Google Tag Manager installed. If you don’t know how to
install Google Tag Manager, then check out this video right here. So in our Google Tag Manager account, we can now start implementing this tech. All you need to do is
go to Tags right here, click on New, name this tag, and head over to Tag Configurations and here you usually choose the tool that you want to implement. Unfortunately, there is no tag template for Facebook just yet, so we have to go with the custom HTML tag. You click that and it will
give us an HTML window where we can implement our code. Now what’s important about
this code to understand, there are actually three parts to it. The first part being our base checking, which will load the Facebook library and initiate our Pixel so it knows where to send the data to. The second part are the events. So in this case we have an event called to track a page view. And then last but not least, if your user doesn’t
have JavaScript enabled, there will be an attempt
to load an image tag on the website itself instead so this page view could be counted. Since Google Tag Manager only works on pages with JavaScript enabled, we can get rid of this code here. If you wanted to make sure
that it’s even deployed, if there’s no JavaScript enabled, you could input this
into a custom image tag. So there’s an option up here as well, where you could put in
the URL of the piece that we have just deleted. So that would be this URL,
and deployed separately, I won’t do this since it makes
up only a very low percentage of users who don’t have
JavaScript enabled. So I’m gonna get rid of that. The second part is here, our track call, Which is the even that’s sent
over to Google Analytics. We will put this into a separate tag so we can control the events of it better inside our tag management. So this Google Tag Manager tag actually just deploys our base checking and initiates our Pixel. It won’t send any data
over to Facebook just yet. But it’s important to separate these so you have more flexibility
in your tag management later. One important configuration
we need to do in this tag is go to Advanced Settings
and set the tag priority. So this file is actually before any kind of other Facebook tags. For now I’m just going to put a 99, so the higher the number
is, it will be five first, and we will attach a
trigger, and in this case it will just be the All Pages trigger. So we’ll save this and click
on the preview in debug mode. This will put our browser
and only our browser in a special state that
lets us see on our website when we reload the preview
and debug console down here. And we can see our
Facebook Pixel base code now fired and initiated our Pixel. We can use the Facebook Pixel Helper, which is available for Google Chrome, an extension that I’m also
going to link up below. But right now, there’s no information that has been sent to Facebook just yet, because we don’t have an event that actually gets checked yet. So next up, you’re going to actually deploy our page view tracking, which is the base tracking for Facebook. So let’s go over to Google Tag Manager. And click on New Tag. In this case it would go
over to Facebook as well. Gonna send the page view and this will be deployed on all pages. We will go back to our custom
HTML and input our code that we have just copied out of our tag. So this is the Facebook track call. Now this is JavaScript, so we need to surround it by script tags. Since this is a custom HTML window. Alright, that should do it. Let’s take our trigger. We don’t have to set a
tag priority in this case, because by default it will fire after the base checking code. Let’s save this, refresh our Tag Manager, refresh our page, and we now see our Facebook Pixel code
fired and then our page view. Can also see this in the Tag Assistant, we have our page view that fired, and some automatically
picked up micro data which is not much, just the title. Now to make sure that
this works correctly, you can go to different pages and just check whether the
data is transferred correctly. Seems to be the case, so it’s now deployed on every page where you have
Google Tag Manager installed. If you wanted to see if the data is actually received by Facebook, we can go back to our Manager
here and see the activity. Now let’s reload this. We have our page view. And right here we have our
newest data that was initialized. So does it state Pixel initialization, and then up here we have our page view. Now if you want to have a little bit more comprehensive view, you can
go to View Analytics here, which will open up Facebook Analytics, which has a better view on the data by going to Event Debugging. So right here you could find your Pixel, in our case we have our page view that was fired into the demo shop, and seems to be working correctly, and is now tracking our
movements on the page. So this is how you install
Facebook pageview tracking with help of Google Tag Manager,
to spin this to the end. To actually make it live to all you users, you actually need to submit a
version to Google Tag Manager which will publish this container live to your website so
every user will be tracked. Give this a descriptive name. And then publish this to all your users. And this is now live on your website;. And if we reload our page here… Now let’s go first out of
our preview in debug mode. So even though we are not in the preview in debug mode anymore, the
Pixel still fires correctly, as we can see in the
Facebook Pixel Helper. In our next video, we’re going to learn how we can deploy custom Facebook events with the help of Google Tag Manager. Alright, so this is it
with our first video on how to install the Facebook Pixel with the help of Google Tag Manager. Now that the base tracking
code is installed, we want to go on to more
sophisticated tracking, and this is where event Tracking comes in. So in the next video,
I’m going to show you how to track button clicks with the help of Google Tag Manager and forward it on to our Facebook Pixel. So don’t be shy, head over
to the next video over there. And if you haven’t yet,
consider subscribing right over there, because
we bring you new videos just like this one every week. Now my name is Julian,
see you on our next video.

43 thoughts on “How to install the Facebook Retargeting Pixel with GTM (2018): Part 1

  1. Hello, thanks for the tutorials, they really help me. But I'm a little confused. I installed my pixel completely different with a certain code named: window.google_tag_manager[{{Container ID}}].onHtmlSuccess({{HTML ID}}); That's the only one I have..

    But I see you installed pixel base code and then also one for all pages?

  2. Hi ,thank you..your videos are really helpful
    But i have a question.
    Whats the real difference between cpc ( cost per click) and cpa( cost per action)
    Do money is charged on specific action ….like on purchase, leads..
    Or cpa is just a elaboration of cpc,in which its tells u more in detail about conversion happened .

  3. What about the firing setting? FB suggests to fire the base tag "once per page" instead of "once per event".

  4. I am new to this, does this tag fire only when a person gets to your website by clicking on any of your FB ads? If so how do you track the clicks on the individual FB ads to measure their performance? Do you need pixel code installed for each one? Or does it fire whenever your website is visited by someone and tells FB?

  5. Hi, Julian!
    How can I set up cross domain tracking in GTM for a FB Pixel? Is it the same process as for a GA tracking code?

  6. Are there any ways to filter out the traffic coming from certain IP addresses, or any other types of traffic filters in FBA? Thanks

  7. Hi, Julian, thanks for the vids, you have been a great help, but I seem to have encountered something strange:
    1) In the preview console I can see that my tag fire
    2) But the Pixel Helper does not how information about the tags, it shows only pageview trigger with an error saying: facebook_pixel_did_not_load_description
    3) When I open Facebook Pixel, there is no data gathered, BUT!
    4) When I open Facebook Analytics, I can see the list of tags fired, although some frequencies seem to be incomplete. (I am also trying your other video with "Add To Cart" tag

    Where could be the problem with the Facebook Helper?

  8. I setup everything according to your steps but atlast in extension it shows the " ERROR in PageView i.e, The Facebook pixel code on this page didn't load, so no information was sent to Facebook.. I am unable to understand why i getting that, even when bothof the tags FB Pixel Base Code and FB Pageview fires on page load/refreshing window..

  9. Super. Awesome. Video. Good pacing and explanation. I have a lot of FB experience but hadn't added the pixel with GTM before. Worked 100%!

  10. Hi Julian, what is the main importance to set the tag priority "99" to be fired first, before ohter tags (ex. linkedIn marketing solutions or GA) ? Thanks !!

  11. Hi Julian, thank you for your video. Can you share with me the benefits of installing the facebook pixel on GTM, if I already have both on my website? Does it get me more accurate conversions tracking eg. view on mobile & convert on desktop?

  12. Should the base without the page view code have 'once per event' selected or 'once per page' ? The last gtm fb pixel tutorial you said to select 'once per page'

  13. Hi Julian, thanks for the tutorial. I see in your video that you get alot of "gtm-msr.appspot" referrals.

    In a previous video you provided a workaround to this issue. Can we still use that technique and is it still needed?

  14. I've subscribed. I am a newby and this was very very helpful. Thank you. I am going for part 2 now. Thumbs Up!

  15. Hi, I have follow your steps but when I go to Pixel Event helper it says "The Facebook pixel code on this page didn't load, so no information was sent to Facebook.Learn more" This is very weird because when I follow your instructions and show the preview mode, it told me the pixels where being fired… It looks like if there was a problem when communicating the events with Facebook.

  16. Quick question – When I copy the HTML from facebook and go to put it in GTM, I have one extra line of code that isn't showing on your video. Do I need it? And what does it do? I attached the code below. The code in question is the middle one.

    fbq('init', 'xxxxxxxxxxxxxxxxxxxxxxxxxxxxxx');
    fbq('set','agent','tmgoogletagmanager', 'xxxxxxxxxxxxxxx');
    fbq('track', "ViewContent");

  17. Hi Julian, how would you distinguish between properties while inserting a pixel using GTM? e.g. I want my FB pixel to only fire on my main website, not my demo website

  18. If Facobook Pixel Helper comes back with an error. You need to de-activate AdBlock as guys mentioned below. But if that didn't help try going to:
    1. Chrome's settings
    2. Privacy and Security
    3. Scroll down until you see Send a "Do Not Track" request with your browsing traffic
    4. Tick the box.
    This worked for me, hope you'll find this helpful.
    EDIT: Also try removing any third party VPN extensions. They were messing with GTM and Pixel too.

  19. Hi Julian, I must say you almost open a treasure box through your videos.

    Just one question – If we run multiple conversion based campaigns on Facebook with multiple landing pages on the website.

    So, do we need to create multiple triggers and tags for this?

    Thanks in advance.

  20. Is there a reason why you wouldn't keep the Pageview event in the base code tracking since that is pretty standard anyway? Just curious…

  21. Does it work for you? I implemented this but after 24 hrs, pixels isn't picking up anything anymore. Pixels in website seems okay, the helper is not showing any issues, no ad blocker in my chrome, GTM is firing the pixels in every page. But I still get 6 total page view from the same day I installed it like 25 days ago. Hmm does it mean that this method doesn't work anymore due to updates? Or am I missing one final step?

    Thanks!

  22. I use Google Sites for hosting and this just doesn't seem to work. Can anyone confirm if you can use Facebook Pixels with a site hosted by Google? Or am I stuck with Google Analytics?

  23. Hi Julian, great content as usual! Quick question, I'm currently trying to deploy a FB pixel on an eCommerce website (subdomain!!). For some reason, it does not return any event to FB events manager. Any thoughts? Thanks

  24. Hello Julian,

    Great content available here, but i am still facing problem to create new variables for Facebook Conversion i.e, purchase event. Please guide me through for setup successful event on Google Tag Manager.

    Thanks,
    Geetika

  25. Is it possible to fire Facebook pixel only if visitor have landed to a certain page via a Google Ad? Other visits at that page will not be counted.

  26. hello Julian – hopefully you're still monitoring the older video's. just to get straight – you're manually installing (instead of GTM auto) so you can split the snippets into three tags. one for base tracking/ another for the pageview/ a third for image (but its rarely needed)… the advantage is that as you can create custom triggers using GTM then you have more flexibility as to what you eventually fire back to FB? So given you are splitting the snippets for the purpose of GTM flexibility.. a follow up would be then – if you have another data source like a link shortener then I would just use my standard FB pixel for that an not my GTM?

Leave comment

Your email address will not be published. Required fields are marked with *.