Exact matches only
Search in title
Search in content
Search in posts
Search in pages

How to add Facebook conversion tracking to your online form?

If you want to add Facebook conversion tracking to your online form, but couldn’t figure it out how to do this, simply follow our guide.

You have two options of tracking:

  • the form’s submissions ( the script is added on the Thank You Page)
  • the form’s activity ( the script is added on the form)

Track Form Submissions


1. Generate your pixel code in your Events Manager on Facebook.

2. Go to Facebook Pixel in Events Manager, select to install Pixel and copy the entire pixel code from point number 2.

Facebook Pixel Tracking Form

3. Paste it in a text editor like Notepad.

4. As you can see the base code of the script has HTML Tags.

Facebook Pixel Tracking Form

5. In order to incorporate those HTML elements on our side, please go to Settings – Thank you Page – Show HTML Block . Add the highlighted tags in the source code of the HTML block field( the <> button on the top right side of the editor)

Now you have added the HTML. Next, let’s see how to add the actual script.

6. Copy the script part in another Notepad, without the comment line and the HTML tags.

So the code should start with:

!function(f,b,e,v,n,t,s)

And end with:

fbq('track', 'PageView');

Facebook Pixel Tracking Form

7. Save the Notepad document with the extension ‘.js‘.

Facebook Pixel Tracking Form

8. Upload the file (document) on a trusted web server (yours recommended).

9. In your 123FormBuilder account, go to My Forms, select your form and go to the Settings – Advanced section.

10. Enable the option Add a JS script to the Thank You page of your form and paste the URL where your .js file is located.

Facebook Pixel Tracking Form

Track Form Activity


The steps are the same as explained above. Two steps are different. The HTML and the script’s placement will change. Since we are tracking the form’s activity, both will be added directly on the form.

Therefore, at point number 5,  incorporate the HTML elements from Facebook pixel into a HTML block field or the Form Header.

At point number 10, enable the option Add a JS script to your form and paste the URL where your .js file is located.

Facebook Pixel Tracking Form

If the steps have been followed correctly, your online form should be already tracked on Facebook.

6 comments

  1. If the site is hosted on wix, how would I accomplish this? We have a FB ads campaign running, but we’re not seeing our custom conversions come through (Thank you page URL).

    In GA, we only see 123form – conversions coming through , in the referral channel and think this is due to improper allocation of the conversions showing up in Google Analytics.

    Please advise.

  2. The FB pixel code needs to be on the actual Thank You page, not just referenced in a JS file.

    How can you do that?

    1. Hello Noah!

      The Add a JS script to the Thank You page of your form option is equivalent to adding the code on the actual Thank You page. The only difference is that the code is hosted on a server, instead of being directly added to the page.

      Facebook provides the pixel tracking code in HTML format, meaning that when you add it to a js. file, you’ll need to remove the first line and the <script> and <noscript> tags. So your tracking code should begin with function ().. followed by the rest of the code until the line window._fbq.push([..}]); (without the </script> tag at the end). Next, copy the last line of the code (the one with the <img> tag) and paste in the source code of your HTML Block of the Thank You page (enabled in NotificationsThank You Page and RedirectsShow HTML block).

      You cannot add JavaScript codes to the Show HTML block option, due to security reasons, so the pixel tracking script cannot be copied there.

      If you need assistance, don’t hesitate to contact our Support Team at support@123formbuilder.com or via our contact form.

      Thanks!

    1. Hello Maryanne!

      The URL is the location where you have uploaded the .js file that contains the Facebook conversion pixel code you saved. Here’s how it goes:

      You copy the code from your Facebook Ads Manager and paste it in Notepad. You then save the document and add ‘.js’ at the end of the document’s name. This will save the file with the extension ‘.js’ which is a JavaScript file. Now, you will need to upload the file on your website’s server. The URL is the path that takes you to the content of that ‘.js’ file. For example: ‘http://www.yourdomain.com/my_conversion_pixel.js’. This is the URL you will need to add to the option Add a JS script to the Thank You page of your form.

      Uploading the file on your website’s server would imply the use of a File Transfer Protocol software (FTP). Your website’s server contains all files that create every aspect of your website. If your website is hosted by a website builder (Wix, Weebly, Squarespace, GoDaddy, etc.), then you will need to contact its customer support to ask for access to your website’s server or ask them to upload the ‘.js’ file for you.

      For more assistance, don’t hesitate to contact our Support Team at support@123formbuilder.com or via our contact form. They may set up the conversion pixel for you, if the help is needed.

      Thanks!

Leave a Reply

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

Frequently Asked Questions

Here is a list of the most frequently asked questions. For more FAQs, please browse through the  FAQs page.

Is this service free?
Yes, we offer a free form builder service. Just sign up to the Basic plan and you are all set. This plan is forever free, but you are limited with a few features only, such as 5 forms per account, 100 submissions per month and you have to keep the backlink to 123FormBuilder on your forms. Check out our features matrix for more information.
How many forms can I create?
It depends on the service plan you are on. Higher service plans enable more features, including more web forms for your account. If you need more forms, go to the My Account section of your account and click the upgrade button. To create an unlimited number of forms, either upgrade to the Platinum service plan or higher. Consult our features matrix for more information.
How can I publish my forms?
You can publish your forms in many ways, by using their direct URL or HTML link, embedding them with a JavaScript code, Inline HTML or iFrame, using the Facebook app or the WordPress plugin, using popups, the Blogger code snippet and many more. Once you have created and customized your form, go to the Publish section to complete your work. Read more in our documentation.
How do I change my form design?
You can change the design of your form in the Themes section, which is located in your form settings. We offer a set of more than 30 predefined form themes for your forms, but you can also create your own from scratch. You can customize the submit button, the logo and more. To apply your own stylesheets, all forms come with a custom CSS editor.

Can't find what you're looking for?