How to have FB pixel event fire from popup


#1

I’m using a popup on an existing html page (not built/served by unbounce), and would like to fire a FB event (“CompleteRegistration” event) when someone clicks on a button in the popup form.

Problem is that when I add javascript to the popup that just fires the CompleteRegistration event… FB Pixel Helper doesn’t see the CompleteRegistration even, and I’m seeing this error in the chrome inspector console:

“Uncaught ReferenceError: fbq is not defined”

This is the javascript I have in the popup builder:

<script>
$(document).ready(function () {
  $('#lp-pom-button-22').click(function() { 
      fbq('track', 'CompleteRegistration', {
        value: 1.00,
        currency: 'USD' 
      });
  })
});
</script>

Based on @Jonathan’s answer here (Issue with Facebook pixel), my theory is that I need to fire the base code from within unbounce as well.

But I’m worried about firing the FB base code twice — once from the html page’s section, and once from the unbounce popup.

Questions:

  1. Do I need to fire the FB pixel’s “base code” from within unbounce too? Is this how to get the CompleteRegistration event to fire properly upon action (button click) on the unbounce popup?

  2. Will it conflict with the FB pixel base code that is already being fired in the existing html page’s section?

Thanks in advance!


#2

Hey @dr611, good question!

Think of your popup as if it were a page of its own. You and I know it’s a popup, but the pixel doesn’t.

The popup will require the base pixel code, which you can re-label if you wish to (i.e. base code triggers “pageview” for the page and “popupview” for the popup).

Does your popup have a form? If so you’ll want to track the conversion as well. In the confirmation box section of the popup, install both the base code + the event code for leads, separately. Re-label it as well (i.e. “lead” can be “popuplead” instead).

Hope this helped! Please let me know if I wasn’t clear in my explanation.

Cheers!


#3

Thanks @jonathan!

The popup is a form, and it’s structured as a question with 3 answers – each is a button. It’s an exit survey asking “Did you buy it? (from the offsite domain I sent you to as a lead…)”. The 3 answers are: yes, no, not what I was looking for.

I want to fire a different FB event based on the answers, so I can segment the users based on their answers. I was thinking of using the FB event CompleteRegistration (because we’re not using that one for anything else), and giving each answer a different value.

Is there a better solution for tracking these “conversions” on the form?

Is there a way to have a 4th segmentation of the users who see the form – eg., they did not answer question on form because they closed it or it’s been 30 minutes without a response.

The FB event code I was thinking of using would be: (note the different value for each button click):

<script>
$(document).ready(function () {
  $('#lp-pom-button-22').click(function() { 
      fbq('track', 'CompleteRegistration', {
        value: 1.00,
        currency: 'USD' 
      });
  })
});

$(document).ready(function () {
  $('#lp-pom-button-23').click(function() { 
      fbq('track', 'CompleteRegistration', {
        value: 0.50,
        currency: 'USD' 
      });
  })
});

$(document).ready(function () {
  $('#lp-pom-button-24').click(function() { 
      fbq('track', 'CompleteRegistration', {
        value: 0.00,
        currency: 'USD' 
      });
  })
});

</script>

#4

Re-label it as well (i.e. “lead” can be “popuplead” instead).

Is this how we create custom events? When you say “re-label”… do you mean in the base code…

change this:
fbq(‘track’, ‘Pageview’);

to this:
fbq(‘track’,‘UnbouncePopupView’);


#5

Good questions! Do you have a Thank You page for every answer? The easy way would be to trigger a different pixel event on every Thank You page + an event for those who simply view the popup.


#6

Re. re-labeling: Yes exactly! This will create a custom event (but not a custom conversion). If you want to optimize for that event or attribute it to your campaigns, you’ll need to create a custom conversion for that event!


#7

I really need help in creating an event Lead on button click. Here’s the scenario. The customer has to enter a zip code, then click Submit. The Submit button needs to be tracked whether they entered a valid zip or not. A modal (popup Form is used in this landing page). I could hardly figure out how to do it. I am new in creating FB Lead events. Thank you very much for the help.