You can integrate Typeform and many other form services into your website or applications either via embedding or as iframes.
In addition to my previous article titled Forms; Logical Operations and Email Routing, I will also cover how to use hidden fields specifically within Typeform, and how these hidden fields can be linked to HubSpot.
Typeform
Typeform is one of the successful form solutions that allows you to create customizable forms for various purposes without requiring any code, and link these forms to different services (CRM systems, advertising platforms, databases, etc.). In the remaining sections of this article, I will discuss how to add hidden fields such as source to a sample form created with Typeform, the use of utm parameters, and how these fields can later be linked to HubSpot.
Typeform Hidden Fields
Typeform allows you to create hidden fields within your forms that do not appear in the form flow but instead capture values through URL query parameters and pass these values when the form is submitted. These hidden fields can be created by following the steps: Logic > Advanced > Hidden Fields, and you can view the created fields as shown in the example: https://example.typeform.com/to/example?source=email.
If we’re delivering a form link within an email newsletter, we can use the recipient’s name and email address as parameters. This way, we’ll be able to easily associate the form with the individual1. Additionally, we can also use the recall feature to access form-related information within the form itself2. For example, you can view a sample form via the link https://successteam.typeform.com/to/nzthWI?name=Joe Doe.
By using a hidden field named source, we can group and display the channels through which the form was distributed (such as social media: Facebook, Twitter, email newsletter, direct, etc.) in the form summary section.
Hidden fields (hidden fields) can be used in various areas, including Typeform reports, and also in CRM integrations such as HubSpot. Below, you can see detailed information on how these data elements are integrated with HubSpot.
HubSpot
HubSpot is a cloud-based customer relationship management (CRM) application that offers many different features (CMS, forms, automations, etc.) under various packages, and can also be described as a comprehensive marketing, sales, and service platform. With its wide range of integrations, it can easily connect with many external applications; Typeform is one of these options3.
HubSpot Source Linking and Performance Advertising
HubSpot can be linked to your Google Ads account and, by extension, your ads4. This allows you to optimize campaign performance and ad budget tied to HubSpot Pages, and set more detailed and consistent customer targeting goals. You can track these insights from the Marketing > Ads page.
Under Contacts, you can also add the Source column to see which source a particular contact originated from5. At this stage, I’d like to elaborate on the Typeform integration process. When HubSpot and many other services are integrated with a different service, if no reverse feature exists, data coming through the integration will either be marked as (not set), undefined, N/A, and similar placeholders, or will be labeled as direct. Typeform provides the option to use UTM (Urchin Traffic Tracking) URL parameters during this process6 7 8. However, for ads or other ad campaigns to be attributed through Typeform, the ad landing page must include utm_ parameters; for example: https://example.com/?utm_source=Google-Adw&utm_medium=Cpc-Text&utm_campaign=Marka&gclid=....
Similarly, you can also track the volume of relevant sources using Traffic Analytics9 10. By leveraging the definitions used in the HubSpot integration, we can categorize form entries within Traffic Analytics9 11.
Reconfiguring the Typeform-HubSpot integration fields may be required for this process. In such a case, the existing integration must be removed and reconnected.
TypeForm and HubSpot Integration
First, we need to enable UTM definitions through the Settings > UTM Tracking page of the relevant form.
You can set up the HubSpot integration by following the Typeform > Connect > HubSpot steps. It is necessary to map the form fields to their corresponding HubSpot fields, including standard fields (email, first name & last name), as well as UTM and hidden fields.
As illustrated in the images above, the process will take three steps. Afterwards, you can start using the form by adding UTM parameters and, if needed, hidden fields; for example: https://example.typeform.com/to/hDEgbZqp?utm_source=google&utm_medium=paid&utm_campaign=ppc#source=cpc. You can update these parameter values according to your specific needs, different channels, and campaigns9.
Footnotes
- Hidden fields explained. Typeform Help Center ↩
- Recall Information (Classic builder) ↩
- HubSpot. Typeform Connect ↩
- Connect your Google Ads account to HubSpot. HubSpot Knowledge Base ↩
- Contact’s ‘Original source’ value changed ↩
- Homepage: Definition. Google Ads Help ↩
- Tagging your Google Ads final URLs. Google Ads Help ↩
- What is UTM tracking? Typeform Help Center ↩
- Understand HubSpot’s traffic sources in the traffic analytics tool. HubSpot Knowledge Base ↩ ↩2 ↩3
- [Analyze your site traffic with the traffic analytics tool. ↩
- Understand ‘Original source drill-down’ properties ↩