Tracking form submissions using the Facebook Conversions API (Zapier)

 

What is Facebook's Conversions API?

The Conversions API tracks events server-side, compared to the pixel which tracks them browser-side. You can implement this if you suspect some conversions might not be tracked due to visitors having browser tracking disabled, such as blocking all cookies or opting out of apps tracking them on their iPhone.

What are the requirements?

  • Using the Facebook Business Manager
  • Having a pixel and having it implemented on your page. You should use the same one for browser and server events.
  • Having a Zapier account

You can find Facebook's documentation for this here: https://d.pr/yZgzUr 

 

What are the steps?

1. Firstly, go to your Events Manager in Facebook, create a pixel if you do not already have one, and add it to your landing page under Integrations > Marketing Tags & Pixels as shown here: https://d.pr/a8mBci

facebook pixel gif.gif

 

After hitting Save, make sure you go back to the slideout of the page and press the Update button so that the pixel is visible on the live URL. It has to be for Zapier to recognize it in one of the upcoming steps.

2. Next, you will need to add a hidden field to the form. Click on your form and select EDIT FORM from the menu on the right.

November 29, 2024 11_33_00 am - Screenshot.png

In the editing window of the form, add a Custom Single-line text field and set its state to Hidden. Set its name to FacebookEventID. It should look like the image below.

November 29, 2024 11_30_09 am - Screenshot.png

The name of the hidden field must be FacebookEventID to match the code below and the value of the field should be left empty. The code below will populate the field's value with a unique ID every time the form is submitted.

3. Next, copy the code below and paste it into the Javascript > Footer section on the right side of the editor.

NOTE: The code generates a unique ID and also tracks a Lead event with browser-side tracking, attaching that event ID to it. This is for cases where both the browser-side and the server-side tracking fire, and the event needs to be counted only once. You can read more about this here: https://d.pr/Ysdk8i

4. Save and Update the landing page before moving on to the steps that need to be done in Zapier.

5. Log into your Zapier account and click on Make a Zap.

6. Choose Instapage as the app for the Trigger step.

Screen_Capture_on_2021-06-09_at_16-56-51.gif

7. Pick the event that will trigger the Zap, which in this case is Form Submission. (This means that whenever someone submits a form on the page that you choose in the next step, the things chosen in the Action step will happen)

8. Click on Continue, then connect your Instapage workspace. To do this, you will need a unique token that can be found in Instapage by going to Workspace settings > Integrations.

zapier integration.gif

9. After your workspace is connected, choose the landing page that you want to integrate. Zapier will pull in the fields present on the form(s) on your page.

Click on Continue until you get to where you have to set up the Action step.

Screen_Capture_on_2021-06-09_at_17-06-13.gif

10. For the Action step, choose Facebook Conversions. fbconversionszapier.png

11. Choose Lead event. Screen_Shot_2021-06-09_at_17.15.18.png

12. Choose the Facebook Conversions account that you will track this in.

13. For the Action Source, choose Website.action-source-website.png

14. Select or connect the Facebook Business Account that you are using and the Facebook Pixel that you are using - the same one that you connected to the landing page in Step 1.

15. Now you will Set up the action.

In the Event ID field, map the hidden field that you created earlier.

eventidmapping2.png

16. The page URL can also be mapped next. The test event code can be grabbed from Facebook Business Manager, in the Test Events tab, as shown below.

testeventid.png

17. In the Customer Information section you can map the other fields of your form, but keep in mind that all the data you will see in Facebook Business Manager reporting will be hashed. You will not see plain text data like you would in our Leads section or in a CRM. Please refer to Facebook's documentation to see how this data can be used.

18. Now you can test your Zap and turn it on. The tests will show up in the Testing section inside Facebook Business Manager if you added the provided test code in a previous step.

Test and finish the Zap

 

Things to keep in mind

  • The instructions in this article already include what is found in this one: https://d.pr/Zl25Hw, in terms of implementation (adding the pixel and the tracking code for form submissions). It is sufficient to do the steps listed in the present article if you want leads to be tracked both browser-side and server-side.
  • The "instapageFormSubmitSuccess" function can only be present on the page once, regardless of how many forms you have or how many actions you want to trigger after form submission. In case you have multiple snippets that need to fire after form submission, you must add all of them under the same Form Submit Callback function as shown here: https://d.pr/NB2nwd. If the snippets are not added under the same Form Submit Callback script, only the last function in the source code will be triggered.