I’m curious. Have you received an answer to that question?
Yes. Hristain (h@revise.cc) sorted it out for me.
Hi, would love to know the answer to this please!
Can you share the solution to this please as it would be great to know how this was done. Thanks in advance
Hristain (h@revise.cc) would have to share that out as it was his magic. I couldn’t begin to explain how it was done.
I had the same issue and after many hours I figured it out.
I found the answer here: (https://glitch.com/edit/#!/tf-embed-with-params)
Essentially you need a HTML file and a .js file (I give my html and JS files the same names)
In the html file you need to refer to the .js file (as it contains the name of the TypeForm)
I wanted to pass multiple parameters, but the sample code was not clear on this.
Edit the .js file and specify each parameter you want to fetch from your URL:
(get the rest of the code from the sample site above)
url += “?dealer=” + params.get(‘dealer’); //Note: You can give it any name
url += “&rep=” + params.get(‘rep’);
For second and third parameters onward you need to change the ? to a &. Simply copy and paste the second line to create additional parameters.
Then call your website as follows: http://yoursite.com/?dealer=Coyote&Rep=RoadRunner
The HTML will call the JavaScript File, and the JS file will open your TypeForm and pass the parameters from your URL to the Hidden Fields of the TypeForm.
I prefer this, since it does not display the name of the TypeForm in the HTML like previously.
Hi dbDesigner,
I have the same issue and tried your solution.
It doesn’t seem to work anymore.
Have you tried it recently ?
Best regards,
Hi Vincent
For some reason, I only saw your question now, so I apologize for the delay.
My forms are still working and pass the parameters just fine.
I created a Typeform Menu and based on the user choice it opens other TypeForms and passes the initial parameters to those sub-forms using the very same method, using the combination of an HTML and JS file. The HTML file contains the name of the JS file and each JS file contains the name of the TypeForm and parameters to be opened.
You need to have these two lines in the body of each html file:
<script src="https://embed.typeform.com/embed.js"></script>
<script src="/script.js"></script>
script.js refers to the file that needs to be in the same folder on your web server as the index.html file.
You can call it any name. I name my .js files the same as the .html files to keep it simple since I now have multiple forms passing parameters to each other.
In the .js file you need to specify the name of the TypeForm and the parameters that you want to pass to the TypeForm.
Remember that the parameters you use in the .js file must be defined as hidden fields in the Typeform.
This line in the js file specifies the parameters:
url += "?utm_source=" + params.get('utm_source');
If you want to specify more parameters, just add more lines:
url += "?utm_source=" + params.get('utm_source');
url += "&affiliate=" + params.get('affiliate');
As you can see, the first parameter must start with ? and the next ones with &
Then simply open the URL as follows: website.com/?utm_source=fb&affiliate=whoever
Hi,
Thanks a lot for your help, I’m almost there thanks to you, but I’m still struggle on the front part.
I was able to create an embed form which pass the URL paramaters to the hidden fields of my Typeform.
But my typeform comes from a popup triggered by an embed button on my website, and I’m unable to adapt the code (which is made for an standard embed form widget) so that it displays the button like in the code Typeform gave me.
To sum it up, I have this code below working
Hello!
<h1>Hi there!</h1>
<div class="target-dom-node" style="width: 100%; height: 500px;"></div>
<script src="//embed.typeform.com/embed.js"></script>
<script src="/script.js"></script>
</body>
But I’m unable to adapt it to my Typeform embed button code, which is this one 🇸🇦
Test d’éligibilité
I don’t know if I’m clear but I would love to have any help!
Thank you very much,
JB
Here’s a working solution for popup embed
<a id="typef_orm_link" class="typeform-share button" href="#" data-mode="popup" style="display:inline-block;text-decoration:none;background-color:#FF6900;color:white;cursor:pointer;font-family:Helvetica,Arial,sans-serif;font-size:20px;line-height:50px;text-align:center;margin:0;height:50px;padding:0px 33px;border-radius:25px;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:bold;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;" data-size="100" target="_blank">Oferta pe Mail </a>
<script src="https://embed.typeform.com/embed.js"></script>
<script>
var p = new URLSearchParams(window.location.search);
var url = "https://homefinders.typeform.com/to/YNpMBLfT?typeform-medium=embed-snippet";
url += '&utm_source=' + p.get('utm_source');
url += '&utm_medium=' + p.get('utm_medium');
url += '&utm_content=' + p.get('utm_content');
url += '&utm_term=' + p.get('utm_term');
url += '&utm_campaign=' + p.get('utm_campaign');
window.addEventListener("DOMContentLoaded", function() {
document.getElementById('typef_orm_link').href = url;
});
</script>