I setup FaceBook Pixel by adding manual code to my www.MarkDKBerry.com website html before I realised it could be done with Google Tag Manager. Of course…it’s Facebook, init… so when I tried to backtrack I discovered that…

a. I cant delete my FB Pixel

b. I am not allowed to make another pixel

Yikes! But then I found this official setup link which suggested maybe I could adapt my existing FB Pixel to work with GTM…

https://www.facebook.com/business/help/1021909254506499

So I stumbled about trying to find more info on reconfiguring my Fbook Pixel to recieve data from Google Tag Manager. Following the above link kinda worked out, and I got some thing working, so removed all the Fbook Pixel html from my site.

I had been wondering if Facebook Pixel was going to be in a face off with my Google Tag Manager setup kinda like Godzilla versus King Kong competing for my site traffic data, hopefully now I would not have that issue.

Always check with the Gooroo

I should have known to check with the Gooroo of these things first, Mr AnalyticsMania.com and I would recommend working from his post (below) to setup the Tags and stuff in Google Tag Manager that can communicate with Facebook Pixel in Facebooks Event Manager.

Follow This Method Not the One I did

Here is his post, follow this method if you want an easy life and can setup Google Tag Manager (GTM from now on) – https://www.analyticsmania.com/post/facebook-pixel-with-google-tag-manager/ If you cant setup GTM find his other posts on it, he is the Gooroo [Sitar riff plays].

But the Facebook template he recommends in the article does not seem to be available on GTM any longer (I later found out it is, and this fact is referenced in his comment section when he says…

“Simo’s template now belongs to Facebookincubator (or something like that). There is still only one FB Pixel template. Use the one that is in the gallery.”

There is actually two, but use the incubator one. I did for my Custom Events later on and it works fine.

So, I recommend you go with his setup in the link above, but by then it was too late for me, so I stuck with my first FB Custom HTML Pixel Tag, since it had worked, and I will share my setup with you below. But from then on I used his instructions because HE IS THE GOOROO!!!!! Honestly, without him I would not have got this working.

FIRST TAG SETUP “CUSTOM HTML” (Dont do it this way)

This assumes you have been through the fire with GTM and know how to work it a bit. I have a bit. This is not about how to use GTM. Go find out from the gooroo about that first. This is about GTM setting up with FB Pixel.

This first Tag setup is not the recommended method, as I said. But if you are like me, you cant be assed to fix it since it is working, but I share my progress more for myself so when I forget all this and come back here to figure out it, I realise what my bad choices were…

It’s not a big deal, but it misses using the Variable Pixel ID approach and needs you to figure out copy and pasting the code from Facebook Pixel.

I hid the pixel number is all, not sure about security etc… but the above image is the Custom HTML Tag in GTM.

I followed the info in this site like I said – https://www.facebook.com/business/help/1021909254506499 and it did work in the Preview Debug window of GTM (You need to search about GTM to find out about that stuff) and got me out of the bind I was in with the html code doubling up on my site. But I would recommend following the Gooroo method using the Template and a Variable Pixel ID as described in his article.

Did It Work?

Well it worked in the GTM Preview, then I remembered to submit that and go live, and then I went to see what Facebook Events Manager had to say for itself after I hit my website with clicks a few times…

FBook is kinda weird, it was hard to tell if it was working. The first view looked nothing like my image above which is with a few more things setup and working which I will get to later. I think I only had Page View showing at first and no obvious data arriving.

But the “Active” notification in facebook.com Events Manager was saying “Last received 14 minutes ago” which was when I had removed the html code from my site pages after my first attempt, but the most recent tests (I did some on a seperate mobile to be sure it was real) seemed not to be showing up…

Until I looked further down the page at “Page View” (circled in the image above) and even further down at the bottom is “View Details” (also circled). View Details only shows up when you click on Page View. So, I clicked on that, and it is the only place it registers page views, and there it was under “recent activities” not being displayed but it had shown up…

Again, the above is different to what you will see (this is the video custom event I will get to later), but my actions were being registered here and ignored everywhere else. So it seemed to be working, but ignoring the Page Views I was making on my www.markdkberry.com website.

Does this mean it would not track visitors? I was a bit confused. But the important point was that the data was getting to Facebook even if it was then being ignored (see the red arrow above). At least I now knew where to find the proof of data showing up.

Creating Custom Specific Tags in GTM

So my first Tag worked. Kinda. It was time to get stuck in. Back to GTM…

As you can see in the image above I have made a few Tags. Google Analytics GA4 is my Google Tag Setup that is sending data about activity on my www.MarkDKBerry.com website. It gets sent from GTM to GA4 and I wrote about that here.

Facebook Pixel – XXXX is the Custom HTML code I just explained (dont do it that way, use the Gooroo article I already mentioned and will be using from now on)

And FB – VideoPlays was my first Custom Event setup and kinda complex so let’s first talk about the other one first…

FB- ViewContent which is the Standard Event you want to send to Facebook Pixel to capture people looking at your web pages. Let’s start there…

Facebook Pixel “Standard Event” Setup in GTM – “ViewCount”

A reminder to use the Gooroo’s web site to set it up – https://www.analyticsmania.com/post/facebook-pixel-with-google-tag-manager/

Jump to #1.3. Constant Variable for the Pixel ID once you are in the article and have a grasp on the concept.

“To make things more optimal, you could create a GTM variable that contains your FB Pixel ID and then just reuse the same variable every time you need it. Once you need to change the Pixel ID, you’ll need to do that just once — in the Variable.”

I called mine “fb-pixel-ID”

jump to #2 in the article if like me you set your first Tag up manually, then…

jump to #3 in the article – How to track events

the Standard Events I probably want are –
PageView
ViewContent
Subscribe (on the youtube button on video page, if this works)

and the Custom Events I want are (though these cannot be turned into ad criteria, he says) –
Outbound link click
Video play (for the video page)
Scroll (on the about page to see if they read about me)

Time on page (maybe later just because)

We’ll just deal with ViewContent and then Video play

So, #3.2 A Tag + a trigger for a Standard Event (View Content is a standard event)

I went through a bunch of fiddly things before I discovered that the Template mentioned was not missing, but had been renamed. So, I doubled back, deleted everything, and stuck to the article. Here is his later comment again in case you missed it too…

“Simo’s template now belongs to Facebookincubator (or something like that). There is still only one FB Pixel template. Use the one that is in the gallery.”

There is two, but its clear which we are talking about here.

Follow the article but…

In GTM I had to save the “facebook pixel incubator” version Template to my workspace first,
and then open a new Tag and search for it.

Then I add my variable id in to the Facebook Pixel ID using the format in his article
{{constant – fb-pixel-ID}} (Which was wrong to write in like that, but I will explain in a moment)

I set event name as Standard and set the drop down to “ViewContent”

Tag Firing options I set as once per page (is this right or should it be per view?)

Tag sequencing I set to “Fire a tag before FB-Viewcontent fires” and chose my main FB pixel Tag.
(weird wording, but okay)

When I went to save it, it gave me the option I forgot to set, to add the trigger and I added All Pages.

I saved and previewed with debug (GTM thing, you’ll find out)

ERROR: unknown variable

So there is something not right with
{{constant -fb-pixel-ID}}

Seems I lost my variable in the changes and revisions…so made it again in the Variable section
fb-pixel-ID xxxxxxxxxx

Another error was sorted out in the Tag setup by clicking on the + castle icon of the ID setting of the Template, and typing in “fb” to search it out. It resolved to {{fb-pixel-ID}} my lovely new variable.

This got me to preview debug mode, phew!

This then showed tags for the ViewContent were present and working, and I remembered to then SUBMIT the GTM and run the same tests again from a mobile device looking at some of my www.MarkDKBerry.com web pages.

Back to Facebook Event Manager to see what gives

Facebook PIxel now showed me the data I had been looking for 40 minutes ago. Eh?

View Content activity was finally present 40 minutes later from my first test that I had thought had failed but had not…the sonofabitch had logged it. But of course, I now had the same “not being logged” errors triggered in the Pageview/View details bit for my current actions. So wtf Facebook?

So it turns out there is a 20 minute delay for data you want to see, but no delay for data that Facebook removes and hides in the Page View/View Details section. hmm, weird given the data clearly is there, so FB is busy with it for 20 minutes before handing it over to you, but whatever, lets move on. In theory since it worked last time, it also suggests by the “removed” data that it has worked this time too. I’ll come back in 20 minutes and check.

The below image shows where you see the data you do get, and it is a bit weird because I just realised there is a seperate one of these for each event (Note this one says “Page View” in the top left while the one I posted above says “video”, I did not know they were seperate until now).

This is where you will see events that are captured and not removed. Event Overview in the View Details section of any Event, and here you can see it says – “It may take up to 20 minutes for your events to be displayed.”

I now go and have a cup of tea….

When I come back I notice a new issue FB event is registering two websites now, probably because I was mucking about with different code approach setups at the start of this journey.


http://www.markdkberry.com
markdkberry.com

It’s not a big issue now but I may have to find out how to deal with it later, I could not find a way to remove one or the other. Maybe if anyone knows they can post in the comments section.

At this point I am sure it is working anyway, so while I wait for the data to show up as a View Content event, I will go and figure out the Custom Events and how to add them as Tags in GTM.

Facebook Pixel “Custom Event” Setup in GTM – “Video”

Now I have the template in place, I can go back to working from
https://www.analyticsmania.com/post/facebook-conversion-tracking-google-tag-manager/#test-pixel

Go to the article and #4.5 A Tag + a trigger for a Custom Event

As luck would have it the article uses an example I need – when someone plays a YouTube video. Finally things might be going my way.

Our favourite Gooroo explains…

“let say that we want to track whenever someone presses the Play button in an embedded Youtube video player that we have on our landing page. First, let’s create a tag. Go to Tags > New >”

Choose the Template we got from Facebook Pixel incubator

I add in my fb-pixel-ID variable the right way this time.

The instructions say select custom and enter “video”
There isnt one to select, so I write it in. (I later realise this is for a label and change it to Video for clarity)

The article then says…

“”We want this tag to fire only when someone clicks the Play button, therefore, we need to create a Youtube video trigger for that. Click the Triggering section in your Facebook Pixel tag and then click the Plus icon in the top right corner. Then click Trigger Configuration > Youtube video and enter the following settings (you can add more if you want, like Progress)):””

I added Start, Complete, and Progress
In progress I added Percentages 10,25,50,75,90 (This will also allow me to target people who half watch my stuff later)

I make sure trigger fires on ALL VIDEOS.

I saved that, then saved the Tag itself calling it “FB – VideoPlays”

Tag firing options I set to “Once Per Event” as I figured there will be multiple videos on each page eventually.

Tag sequencing I set to “fire tag before FB Video plays fires” – and again set that to my FB pixel – xxxxxx Tag (I still find this logic confusing, but its the way).

I also need to get the info on what video was watched so its clearer for me to understand later. I do this in the Tag setup under “Object Properties” and he accounted for it in the article…

“By the way, if you want to add some additional data to the custom event, you can do that by going to Object Properties and adding any custom parameters you need, for example (the variables I’ve used are both built-in in Google Tag Manager. You just need to enable them in Variables > Built-in Variables > Configure.)”

Okay, in the next bit mistakes were made, and we actually needed to do some things first, but I literally wrote the property values in and that was wrong but whatever, it took it…

property name – videoTitle , property value – {{Video Title}}
property name – videoAction, property value – {{Video Status}}

But when I previewed and debugged, GTM threw an error.

“Unknown variable in Video Title and Video Status”

Surprised? not really…

And yes, our favourite GA4, GTM, and FB Pixel Gooroo has done another article on it going into more depth, of course he has…honestly this guy needs a cape and an award at this point…Julius Fedorovicius, you are da man!

So now let’s jump to this next article and work through it. Even though we are not going to be sending it to GA4, it helps us get the rest right.
https://www.analyticsmania.com/post/google-tag-manager-video-tracking/

Step 2. Enable built-in Youtube video variables

Google Tag Manager, go to Variables > Configure and enable all video-related variables.

Done.

Next I do this part (which is located in the Triggers folder on GTM since I set it up already…)

“Also, even though the Add JavaScript API support to all Youtube videos is an Advanced setting, I enable it by default because it increases the change that Youtube video tracking will work.”

Step 3. Create a Lookup Table variable

As our Gooroo explains…

“If a visitor starts or completes a video, we want to send the word “start” or “complete” to Google Analytics [in my case FB Pixel]. But if the visitor has watched a certain amount of a video (e.g. 25%) we want to send not only the word “progress”. We also will send the percentage of a watched video, e.g. progress 25%.
To do that, we will create a lookup variable table in GTM that will return a particular output based on the Youtube video interaction.”

Variables, New, “Lookup Table”

In the Input Variable field enter the {{Video Status}} variable

Then in the Input field enter “progress” (without quotation marks, all lowercase)

and then in the Output field enter {{Video Status}} {{Video Percent}}%

Finally, enable “Set Default Value” checkbox and insert {{Video Status}} variable once again.

“If the video player status is “progress”, this means that a certain percentage of a video was seen by a visitor and this event became available in the preview and debug mode. In this case, we want this lookup variable to return the video player status (progress) and also the video percentage that was watched together with a % sign. But if the Video status is not “progress”, then this lookup variable will just return the name of the status (for example, start, complete, etc.). That’s why I have configured the “Set Default Value” checkbox.

I named my Variable “lookup-table-video” and saved it.

I also then went back to the Tags “FB – VideoPlays” and used the picker to select Video Titles and Video Status in case writing it in had caused issues.

Step 4 is for a GA tag, while I am using FB Pixel, and it is late in the day and my brain is aching,
so I wont try to figure out if I have set this up right, I will just jump back to preview & debug and see what happens…

Yes! on GTM debug I got a video tag fired on playing the video.
I let it run. It is a 9:28 long video, what is 10% of that?
In the Tag debug data layer tab I see info…
youtube start,
Then a new tag fires by itself while the video is playing
I now have four youtube video tags, two with start, two with progress
another one fires while it plays more
oooh, there is also a videoPercent clocking up on there, 10, 10, 25, 25,
but why am I getting double entries?

at 2:47 I pause it.
but when I stop it, no Tag is fired…
(should it be, I dont know?)

I hit play to continue just for shiz and giggles…
no new tag…

3:22….next should be at 50% what is 50% of 9:28 about…er…5 ish…

boom, at 4:45 a new tag fired, yea, data layer says 50 percent, great, this is working but I am getting two tags each time, but maybe it doesnt matter.

I have a quick mosey over to FB events manager and nothing is showing about videos yet…I head back to GTM…

Waiting For Facebook for 20 Minutes

I already know it takes 20 minutes to show up the important data. Though I can see videos.html was clicked on at 15:54 in the usual “data thats removed” area, and then at 16:02 it shows that I clicked away to tunes.html (my music page) and that I did. So it looks like something will show up when FBook sentinels decide to release it.

Time for a cup of tea…I stand at the kettle rubbing my eyes and blinking, looking out the window at things distant and not made of bright light pixels, while wondering what FB is doing with my data for those 20 minutes before giving it to me? A couple of stretches, touch my toes, swing my arms about, talk to the missus and then get back to it…

YES!!!! The video data arrived, though the x2 parameters I need are now listed under “data removed”, so I need to work out how to tell FB Pixel to retain that video progress and status data, and use it.

Where can I find that info? You guessed it..
ask GOOROO!!!!

https://www.analyticsmania.com/post/facebook-conversion-tracking-google-tag-manager/#test-pixel

5. Where can I see/use conversions in Facebook’s Interface?

I will save that pleasure for another day.