See from which CMS Page a User filled out the typeform

General
1

Hi everyone

Does anyone know how to see WHICH cms page the user came from in Typeform?
We made a hidden field and tried to include the following code in the CMS page:

<script> 
  // Get the current CMS Page slug 
  var cmsPage = '{{slug}}'; 

  // Update the Typeform link 
  var typeformLink = 'https://ym6byblmvcg.typeform.com/to/f3T8EVT8#stellendescription=cms_page_placeholder'; 
  typeformLink = typeformLink.replace('cms_page_placeholder', cmsPage); 

  // Update the link on your webpage 
  document.getElementById('typeformLink').setAttribute('href', typeformLink); 
</script>

But somehow it doesn’t work - does anyone have a solution?

Read Only:
https://preview.webflow.com/preview/jobzy?utm_medium=preview_link&utm_source=designer&utm_content=jobzy&preview=19765c273590d952bc6f0837ebc2333b&pageId=644a6e3373d14a5e00ecd348&itemId=6481f8492a55602550a53e91&workflow=preview
Live:

2

Hello @head, your script does not work since you’ve placed it in the head section, meaning it loads before elements with the id typeformLink have loaded yet.
You can solve this by moving the script to before closing </body> tag or wrapping your code with this

document.addEventListener('DOMContentLoaded', () => {

  //Add your code here

})

Also, I have noted that you do have 2 elements with the id typeformLink on the CMS page. Ensure only the specific link that you need to update the link has this id otherwise, the script will only work on the 1st instance element with the id

3

Hello man thank you sooo much!

Can you kindly tell me the exact code i need to put there
?

4 
<script>
document.addEventListener('DOMContentLoaded', () => {

  // Get the current CMS Page slug 
  var cmsPage = '{{slug}}'; 

  // Update the Typeform link 
  var typeformLink = 'https://ym6byblmvcg.typeform.com/to/f3T8EVT8#stellendescription=cms_page_placeholder'; 
  typeformLink = typeformLink.replace('cms_page_placeholder', cmsPage); 

  // Update the link on your webpage 
  document.getElementById('typeformLink').setAttribute('href', typeformLink); 

})
</script>
5

Thank you so much!

the Link now actually works, it gives it the name of the CMS Page!

2 Questions:
How do I do it if I have multiple CTA’s on this page? Since you said I can only use 1 ID Button…?

And where in the Typeform can i now see the where he came from?
because the field is still empty in typeform…?

6

To have multiple CTA’s you can assign them the same id and replace this line of code

document.getElementById('typeformLink').setAttribute('href', typeformLink);

with this

let elements = document.querySelectorAll('#typeformLink');

elements.forEach(function(element) {
  element.setAttribute('href', typeformLink);
});
7

Works perfect!

We decided to add 2 hidden fields:

How would I have to change the code if we want to have the following URL?
https://ym6byblmvcg.typeform.com/to/f3T8EVT8#stellenbeschrieb=xxxxx&firma=xxxxx

“Firma” Also beeing dynamically added from the CMS?

@josephmukunga

8

What do you mean by having 2 hidden fields? Do you wish to replace both the xxxxx fields with the same value?

9

As you see in the url we not only need to fill “stellenbeschrieb” with url Slug but now also fill the “Firma” with a cms field.

NO not bot with the SAME but both with different cms fields

@josephmukunga

10

What do you wish Firma field was

11

Just “firma” from cms.
Exactly like “slug”

@josephmukunga

12 
<script>
        document.addEventListener('DOMContentLoaded', () => {

            // Get the current CMS Page slug 
            var slug = '{{slug}}'; 
            var firma = '{{firma}}'; 
          
            // Update the Typeform link 
            var typeformLink = `https://ym6byblmvcg.typeform.com/to/f3T8EVT8#stellenbeschrieb=${slug}&firma=${firma}`; 
          
            // Update the link on your webpage 
            document.getElementById('typeformLink').setAttribute('href', typeformLink); 
          
          })
</script>