Pass url parameters to a embedded forms/iframes on landingpages

Question

I want to pass url parameters (hidden fields) to iframe/embedded forms on our Hubspot landing pages.

The url parameters I want to pass to the Typeform are utm_sour

Answer 1

This is possible using Typeform Embed API

See a working example on Glitch

You can edit here.

Steps to reproduce:

1. Include Typeform Embed SDK in your HTML

2. Extract parameters from URL

   let params = new URLSearchParams(location.search);

3. Reconstruct your form URL

   var url = "https://YOUR_SUBDOMAIN.typeform.com/to/YOUR_TYPEFORM_ID" url += "?utm_source=" + params.get('utm_source');

4. Display form in a target div

   const embedElement = document.querySelector('.target-dom-node') window.typeformEmbed.makeWidget( embedElement, url, { hideHeaders: true, hideFooter: true, } )

Hope it helps :)