Hi Comvita,
As long as you can trigger a facebook pixel by calling some Javascript, you should definitely be able to set this up in the way you mentioned above! The event listener Javascript you found would need to be added to your website’s code in such a place that it would appear on the same pages as Klaviyo forms. For example, you could add this to your footer template on Woocommerce or have it render on the page via a tag manager like Google Tag Manager after the page loads.
What this snippet does is monitor (or add a “listener”) for a Klaviyo form being interacted with on the page. Once that interaction happens, the second line checks to see if it was a “submit” action that took place. If it was, the code in the center is run, in this case sending some tracking information to Facebook.
Let me know if there’s anything I can clarify!
Walid
Hi Walid,
just to clarify - because I think this question is probably common, the
// add Facebook tracking pixel code here
will need to be replaced with the fbq(‘track’, … ) code snippet that will trigger the facebook events…
(the … will need parameters that user wants to be in teh FB event). My question is, how would you write that code to share the submitted email with facebook’s tracker? I know the fbq( ) has a CompleteRegistration’ event type that also has a ‘content_name’ parameter, but how do you connect the content from Klaviyo with the event in FB?
I am assuming the line is
fbq(‘track’, ‘CompleteRegistration’,{contentname: "X"})
but what would the X be, coming from Klaviyo? “email” ? other?
Hi mehmetb,
Would the “contentname” parameters just be the email in this case? I’m not familiar with Facebook’s tracking specifically, but you can grab parameters from the submitted form using Javascript within the event listener described above. The example here shows how to grab the form ID from the submitted form and send it to Google Analytics and the snippet here shows you how the form event JSON is structured. Top-level items in that JSON refer to the form itself, any properties captured by the form will live in the “metaData” property (ie. e.detail.metaData
). To capture the email address in this case, you would use e.detail.metaData.$email
. Any other name of the properties to capture would depend on the specific form, this is the Profile Property name you would choose when designing that form element in Klaviyo.
Let me know if there’s anything I can clarify or if you were looking for something else!
Walid