将网址参数传递到目标网页上的嵌入式表单/iframe [英] Pass url parameters to a embedded forms/iframes on landingpages
问题描述
我想将URL参数(隐藏字段)传递到Hubspot登录页面上的iframe/嵌入式表单.
I want to pass url parameters (hidden fields) to iframe/embedded forms on our Hubspot landing pages.
我要传递给Typeform的url参数是utm_source，email和referralcode.
The url parameters I want to pass to the Typeform are utm_source, email and referralcode.
我当前正在处理的页面示例:
An example of a page I'm currently working on:
<div class="typeform-widget"
data-url="https://xxxxxx.typeform.com/to/xxxx"
data-transparency="50"
data-hide-headers=true
data-hide-footer=true
style="width: 100%; height: 600px;" > </div>
<script> (function() {
var qs,js,q,s,d=document,
gi=d.getElementById,
ce=d.createElement,
gt=d.getElementsByTagName,
id="typef_orm",
b="https://embed.typeform.com/";
if (!gi.call(d,id)) {
js=ce.call(d,"script");
js.id=id;
js.src=b+"embed.js";
q=gt.call(d,"script")[0];
q.parentNode.insertBefore(js,q)
}
})()
</script>
我需要添加什么代码才能将url参数传递给我的嵌入式表单? 谢谢
What code do I need to add to pass the url parameters to my embedded form? Thanks
推荐答案
可以使用 Typeform嵌入API
在Glitch上查看工作示例
See a working example on Glitch
您可以在此处进行编辑.
复制步骤:
- 在您的HTML中包括Typeform Embed SDK
-
从URL提取参数
- Include Typeform Embed SDK in your HTML
Extract parameters from URL
let params = new URLSearchParams(location.search);
重建您的表单网址
var url = "https://YOUR_SUBDOMAIN.typeform.com/to/YOUR_TYPEFORM_ID"
url += "?utm_source=" + params.get('utm_source');
var url = "https://YOUR_SUBDOMAIN.typeform.com/to/YOUR_TYPEFORM_ID"
url += "?utm_source=" + params.get('utm_source');
在目标div
const embedElement = document.querySelector('.target-dom-node')
window.typeformEmbed.makeWidget(
embedElement,
url,
{
hideHeaders: true,
hideFooter: true,
}
)
const embedElement = document.querySelector('.target-dom-node')
window.typeformEmbed.makeWidget(
embedElement,
url,
{
hideHeaders: true,
hideFooter: true,
}
)
希望它会有所帮助:)
这篇关于将网址参数传递到目标网页上的嵌入式表单/iframe的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
