Dynamically getting hidden values with TF & WordPress | Community
Skip to main content
Answered

Dynamically getting hidden values with TF & WordPress

  • September 21, 2022
  • 6 replies
  • 338 views

Hi - I have a WordPress microsite we’re using as a landing page where the CTA is a button that opens a TypeForm in a popup.

 

I would like to have a hidden field in TypeForm that is dynamically set to the value of URL parameter. 

For example:

  • if the URL is mymicrosite.com/?source=partnerA&campaign=sept2022
  • How do I set the hidden fields in the embedded TF?

The goal is to be able to run multiple campaigns simultaneously and track each signup to a campaign.

 

Thank you in advance for your assistance.

Graham

 

Best answer by mathio-tf

I think you would need to build this integration manually. You could use JavaScript API of Typeform Embed SDK. You would need to populate hidden field values based on the URL by yourself.

Here is an example of how this could work: 
https://glitch.com/edit/#!/tf-custom-hidden-fields

View original

6 replies

Forum|alt.badge.img+1
  • Explorer
  • 10 replies
  • September 22, 2022

I would also like to see an answer to this!  :)
I’m imagining there might be some way for wordpress to dynamically adjust the hidden value in the embedded link to match the value of the url parameter.  This would help me a lot with our chat-style inquiry form that is embedded in our footer for the entire site.


  • Author
  • Explorer
  • 2 replies
  • September 22, 2022

Here’s what I’ve learned:

  • TF will set the utm_XXX fields when available if you add this to the embed div 
    data-tf-transitive-search-params="utm_source,utm_medium,utm_campaign"
  • Now I’m struggling to make sure the UTM params are passed from the URL via an internal anchor link (WordPress site w/ Avada theme)

Liz
Community Team
Forum|alt.badge.img+5
  • Tech Community Advocate
  • 14857 replies
  • September 23, 2022

@mathio may be able to help with this!


mathio-tf
Typeform
Forum|alt.badge.img+5
  • Typeform
  • 888 replies
  • September 26, 2022

Yes, you can use transitive search params to pass params from host page to your embed.

What do you mean by passing params via internal anchor? Do you have any example of what you want to achieve? Can you share your website too?


  • Author
  • Explorer
  • 2 replies
  • September 26, 2022

@mathio - Web site is https://driveforsaferroads.com/

In the hero section, there’s a blue button LET’S GET STARTED that is an anchor link [https://driveforsaferroads.com/#howitworks] to the HOW IT WORKS  section on this page.  

In this section, there is a CTA that opens the TypeForm modal. If the UTM params are on the query string, then the transitive search params work! Happiness.

However, I’m struggling to get the UTM params to properly set on the anchor link in the hero section.

Any suggestions on how to make this work will be appreciated.

Thanks,

Graham

 


mathio-tf
Typeform
Forum|alt.badge.img+5
  • Typeform
  • 888 replies
  • Answer
  • September 26, 2022

I think you would need to build this integration manually. You could use JavaScript API of Typeform Embed SDK. You would need to populate hidden field values based on the URL by yourself.

Here is an example of how this could work: 
https://glitch.com/edit/#!/tf-custom-hidden-fields


Reply