Answered

Hidden field not being passed to form results

  • 22 February 2024
  • 2 replies
  • 38 views

Issue - looking to pass the gclid value. I’m popping up typeform from a button

https://mycorsicacharter.com/

Scenario 3 is an issue

  1. If gclid in url = accepted
  2. If gclid is present in data-tf-hidden on pageload = accepted (so data-tf-hidden work)
  3. If data-tf-hidden filled after pageload - i’m looking to fill the value from a cookie on pageload -gclid not recorded. This is important if the user does not convert on the landing page

<div data-tf-popup="Oag6s5yd" data-mo="v4" data-tf-opacity="100" data-tf-size="100" data-tf-iframe-props="title=DMA 1" data-tf-transitive-search-params="gclid,wbraid,fbclid,msclkid" data-tf-medium="snippet" data-tf-hidden="gclid=55" style="color:white !important;cursor:pointer" ;="" data-tf-loaded="true"><a>Get Started</a></div>

 

How do i change data-tf-hidden on pageload, before user click so that the gclid value sticks?

icon

Best answer by mathio 23 February 2024, 09:41

View original

2 replies

Userlevel 7
Badge +5

@mathio might be able to help with this!

Userlevel 7
Badge +5

Hello @Mo_the_Pirate 

you will need to use embed SDK directly via its JavaScript API with some custom code:

<div id="my-button" style=""><a>Get Started</a></div>
<link rel="stylesheet" href="//embed.typeform.com/next/css/popup.css" />
<script src="//embed.typeform.com/next/embed.js"></script>
<script>
document.querySelector('#my-button').onclick = () => {

// retrieve gclid value
const [, cookieGclid] = document.cookie.match(/gclid=([^;]+)/) || []
const urlGclid = new URLSearchParams(window.location.search).get('gclid')

// prioritize value from URL, then cookie or use default if neither
const gclid = urlGclid ?? cookieGclid ?? 55

window.tf.createPopup('Oag6s5yd', {
size: 100,
iframeProps: { title: 'DMA 1' },
transitiveSearchParams: ['wbraid', 'fbclid', 'msclkid'],
hidden: { gclid }
}).open()
}
</script>

 

Reply