如何使用带有 bootstrap 表单的 Hubspot 表单嵌入代码

how to use a Hubspot form embed code with a bootstrap form

我有一个客户使用 hubspot 进行跟踪和感谢页面。我使用 bootstrap 创建了一个登陆页面,在该页面中我有两个表单。两种形式都相同,我希望它们转到相同的感谢页面。客户为我提供了一个嵌入代码,但我不确定如何弥合差距。下面我列出了我的表单代码和嵌入代码。我基本上希望将用户字段提交到 hubspot 并触发感谢页面,但我不完全确定这是可能的。任何帮助将不胜感激。

<div class="col-lg-12 contact-form">


            <div class="container">
                <div class="formContainer">
                <form role="form">
                <div class="form-group">
                    <div class="col-sm-6 left-field">
                        <input type="text" class="bottom-form" id="firstname" placeholder="First Name">
                    </div>
                    <div class="col-sm-6 right-field">
                        <input type="text" class="bottom-form right-field" id="lastname" placeholder="Last Name">
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-sm-12">
                        <input type="email" class="bottom-form email" id="email" placeholder="email">
                    </div>
                     <div class="col-sm-12">
                        <button type="submit" class="submit bottom-submit">Download Now</button>
                    </div>
                </div>
                </form>
                </div>

            </div>
        </div>

这是 hubspot 嵌入代码。

<!--[if lte IE 8]>

hbspt.forms.create({ css: '', portalId: '2030148', 表格编号:'d9005302-a859-4a39-9d47-74d8a1d25fb0' });

您只是想使用嵌入代码设置重定向吗?如果是这样,这里是嵌入代码的补充: portalId: 'xxxxxx', redirectUrl: 'url goes here', 表格编号:'d9005302-a859-4a39-9d47-74d8a1d25fb0'

我实际上想出了一个合适的解决方案,而无需进行任何重定向或繁琐的编码。

首先我设置了一个本地主机,这是我最大的问题,这有助于让实际的 hubspot 表单显示在我的页面中(使用本地显示嵌入代码不会出现,虽然对其他人来说很明显,但它花了我等一下)。哦,我应该提到代码不是必需的。

一旦你看到它,你基本上检查元素,然后添加到 hubspot 吐出的 类 让它看起来像你想要的那样。