Contact Tracking Via Form Submissions (Start Here)
Video Transcript
Video Transcript
Alright guys, so now that we have our pixel installed on our website, which we just did in the previous video when we went ahead and we created some testing page views so you could see what URL parameters are and all this fun stuff. Again, now that we have our tracking pixel, which is found here, set up, the next thing we need to do is make sure that our tracking pixel tracks the actual contacts. And the way we do that is through form submission tracking.
Now, due to the fact that there are literally hundreds of different forms and form submissions and making it obviously more nuanced to track these forms, we are going to break down form submission tracking into two key parts, alright? There's going to be two types of form. Form number one is going to be a native form, which we'll get to what that means in just a second. And then the second form type is going to be the iframe/embed type form. So now that I kind of break these up, I think you understand a lot clearer what I specifically mean when I say native form or iframe and embed.
So just to continue to dive deep, in the native form, if for example, you're talking about a GoHighLevel funnel with a GoHighLevel form, that is going to be a native form, right? If we're also talking about something like WordPress with HTML form, that is also going to be native because you're building the website on WordPress and you're adding the form into the website, which is basically HTML content. So again, if we continue down, we are going to say things like ClickFunnels plus ClickFunnels forms, right? So if it's a native form to the platform and you're actually building the form into the code, then that is going to be down the native form, which again, we have a video specifically for that. It's honestly very easy, you don't need to do anything asides from set up your pixel and test it, which again there's a video on that. So please if you are building with a native form then go check out that video.
However, if you are doing an iframe embed, which is again going to be your Typeform, Jotform, Google Forms, Calendly, iClosed type of thing where you have to take some code and embed it as an iframe into your website, then that is going to be a separate video as well.
And just to further dig a bit deeper into the explanation of why these have different types of tracking when I say things like iframe embed versus a native form, I'm going to walk you through that right now. So the reason is, when you build a website, all the website really is is something called HTML code. So in here, you have all these squiggly lines of code that stand for HTML and that is what loads your website, right? So when you're building a form, your form is literally a piece of code inside of your website. So that is what I mean when we say a native form.
However, when you are not building a native form and instead you are iframing or embedding, what you are basically doing is you are taking someone else's code and snippeting it inside of yours. So this is calling another server, it's calling Calendly, it's calling iClosed, it's calling Typeform, whatever server that's sending the form, this is basically what's happening. We are adding a snippet that calls an external source, an external place where the data is coming from, aka this form.
And what we do is we obviously install our pixel, right? This whole concept is around pixel attribution. And what a pixel really is is a piece of code that you install at the top of your website, and it's native to your website. It is not an iframe or an embed, you are actually adding a JavaScript code inside of your website, meaning when you add our pixel code inside of your website, we can track everything that's happening inside of this page, right? We can track absolutely everything. We can track things like button clicks, how long someone stays on, how deep they scroll into the page, all these data points we can track where they live, where they came from, what the previous website was, what the URL was, right? Our pixel gives us all this really rich data because you're installing it in your website, meaning we can extract data from this person's browser.
So that is again why native forms work because the code is literally native inside of your HTML. So when someone hits submit on this code that belongs to you in that website, we can track things like a name, an email, a phone number, and then when they hit submit, again we can track that as well. However, when we are doing what's called an iframe or an embed, we are not able to track what's happening inside of this code. All this code does is really connect to another portal. So I'm going to draw an arrow. What it does is it connects to another portal and let's say that this is your Calendly, right? Calendly, you understand. So this is Calendly. So this little iframe now pings the Calendly server for some data and then Calendly sends it back as a form. So they're adding their code. But Calendly is the one that is tracking all of the name, the email, the phone number, all that stuff. Our pixel, we cannot track and we cannot go through this portal and then start tracking inside of
Calendly's server. It is impossible for any pixel to do that. There is data privacy, that's why they do an iframe and embed. The server of Calendly is the one that basically tracks all of that data and our pixel that you placed here has no ability to go into Calendly's server and export the data.
So that is why we have to break it apart into two types of tracking where I'm going to show you how to go ahead and track iframe and embed. It's very simple. If you're curious now, I'll just give you a quick 30-second synopsis. You are basically when someone submits this form, going to add a redirect URL and add the email inside of the URL and it's important that this new URL has our pixel on it because when our pixel is on this URL and we have an email inside of the URL, we can now extrapolate that email as data and then track who this contact is, right? So it's just a simple redirect. Again there's an entire video on that, but I just want to break down the two types of form submissions with a pixel that allow us to track the actual contact, which again, one is native form, so think you're using a
GoHighLevel funnel with a GoHighLevel form, you're building on WordPress with an HTML form or obviously by WordPress, I also am talking about things like, like Framer, right? Framer plus Framer form, uh you know, Webflow, things like that, all these have like a native form that get embedded into the actual website and they're native, like it's code, you're not adding an iframe or an embed. The other style again is the iframe embed and that's where you're going to take a piece of code from a place like Typeform, Jotform, Google Forms, Calendly, or iClosed and you are going to add it inside of your website as an iframe code snippet. So again those are the two differences. Hopefully that makes sense. If you guys have any questions feel free to reach out to our support team in the bottom right corner of our app and our team will be more than happy to help you. If you still don't understand this, that's fine, just go on to the next video whether you're using a native form or an iframe embed form, watch the video and do the steps. It's very easy once the pixel is on there. Uh following a few more steps here is going to be very simple. If you don't know which type you need, again feel free to reach out to our support and our team will be more than happy to help you.
Introduction
With your pixel installed, you can now connect anonymous website visitors to actual contacts. This is done by tracking form submissions to capture a user's name, email, and phone number, linking their identity to their ad journey.
Step 1: Know Your Form Type
Tracking depends on whether your form is native to your website or embedded from another service.
Native Forms: Forms built directly into your site's platform (e.g., GoHighLevel forms, WordPress HTML forms, ClickFunnels). Our pixel tracks these automatically.
iFrame / Embed Forms: Forms from third-party tools embedded on your site (e.g., Typeform, Calendly, Jotform). These require a special setup because our pixel cannot directly read their content.
Step 2: How to Track Form Submissions
For Native Forms: You're all set! The AgentKong pixel in your site's <head> code will automatically capture contact info upon submission.
For iFrame / Embed Forms: You must use a redirect to capture the data.
Set a Redirect: In your form tool (like Calendly or Typeform), configure the form to redirect to a "Thank You" page on your own website after submission.
Pass Data in URL: In the redirect settings, pass the user's email as a URL parameter (e.g., yoursite.com/thanks?email={user_email}).
Install Pixel: Ensure the AgentKong pixel is installed on your "Thank You" page. It will capture the email from the URL and link it to the correct user.
📌 Contract Tracking: Native Forms
📌 Contract Tracking: Native Forms
Now that your tracking pixel is installed, the next step is to link anonymous website visitors to actual contacts by tracking their form submissions. This guide explains the two main types of web forms and how AgentKong's pixel automatically captures contact information from them to enrich your attribution data.
Step 1: Identify Your Form Type
How you track submissions depends on whether your form is Native or Embedded (iFrame).
Native Forms:
What they are: Forms built directly into your website's HTML. The form and the page are a single entity.
Examples: GoHighLevel funnels using GHL forms, WordPress sites with custom HTML forms, ClickFunnels forms, Webflow forms.
Tracking Method: Our pixel automatically detects submissions from native forms. No extra steps are needed once the pixel is installed on the page.
iFrame / Embedded Forms:
What they are: Forms from a third-party service (like Calendly or Typeform) that are embedded onto your webpage. The form technically lives on a different server and is displayed on your site inside a frame.
Examples: Typeform, Jotform, Google Forms, Calendly.
Tracking Method: Due to browser security, our pixel cannot read data from inside an iFrame. A special setup is required, which is covered in the next training video.
Step 2: How Native Form Tracking Works
If you use a native form, the process is seamless.
Pixel Installation: Ensure the AgentKong tracking pixel is installed in the <head> section of your website where the form is located.
Form Submission: When a visitor fills out and submits the form, our pixel automatically captures the name, email, and phone number they entered.
Contact Association: This contact information is then automatically associated with that user's entire session, including all previous page views and the original UTM parameters (Source, Campaign, etc.) that brought them to your site. You can then see this unified data in your Page Views report and Attribution Table.
📌 Contact Tracking: iFrame / Embed Forms
📌 Contact Tracking: iFrame / Embed Forms
This guide explains how to track contact information from form submissions when using iFrame or Embedded forms. Unlike native forms, these require a special setup to pass contact data to the AgentKong pixel. We will walk you through the process using a redirect method that ensures you can still connect a user's name, email, and phone number to their ad attribution data.
Step 1: Identify Your Form Type
First, confirm you are using an iFrame or embedded form.
Native Forms: Built directly into your site's code (e.g., GoHighLevel forms on GHL funnels, WordPress HTML forms). These are tracked automatically.
iFrame / Embed Forms: Created on a third-party platform and embedded on your site. This method is for you.
Examples: Jotform, Typeform, Google Forms, Calendly.
Step 2: Set Up a Redirect on Form Submission
Because our pixel cannot read data inside an iFrame, you must redirect the user to a "Thank You" page on your own website after they submit the form. This redirect will carry their contact information in the URL.
Navigate to your Form Builder: Open the settings for the form you have embedded. In this example, we use Jotform.
Find the Redirect Settings: Go to Settings > Thank You Page.
Select "Redirect to an external link": This option allows you to send the user to a different URL after submission.
Construct the Redirect URL:
First, paste the URL of your "Thank You" page (e.g., https://learn.agentkong.ai/ty-page). This page must have the AgentKong tracking pixel installed.
Add a ? to the end of the URL.
Append the parameters for the data you want to track. The most important is email. The format is key=value. For example: email={email}.
Use the & symbol to add more parameters, such as phone={phoneNumber}.
Your final URL will look something like this:
https://learn.agentkong.ai/ty-page?email={email}&phone={phoneNumber}
Note: The {email} and {phoneNumber} are dynamic tags provided by your form builder. Click the "Form Fields" option in your builder to find and insert the correct tags for each piece of information.
Step 3: Test the Form and Verify Tracking
Submit a Test Form: Go to the page where your form is embedded and fill it out with test information.
Check the Redirect: After submitting, you should be redirected to your "Thank You" page, and the URL in the browser should contain the test data you entered (e.g., .../[email protected]...).
Verify in AgentKong:
Go to Ad Tracking > Tracking Pixels > Page Views.
Refresh the report. You will see a new page view for your "Thank You" page.
Crucially, this new entry will now be associated with a Contact, showing the name, email, and phone number captured from the URL.
By following these steps, you have successfully configured contact tracking for your embedded forms, ensuring every lead is correctly attributed.