I am setting up Hubspot. There is a set up task about replacing my site's forms with Hubspot's forms.
There are two options to choose from: embed forms on external site or use API.
I am trying to choose which option to use. One question that will help us determine it is:
Do both options support all form functionality? I specifically want to know if progressive profiling is available through both options. But I want to know about any other functionality that may not be available with the external site option and the API option so I can make an informed decision.
Some other questions that will help aid my decision:
I want the form to be indistinguishable from the page it lives in on my external site. It needs to be styled exactly like the site. Is this available with both options?
I want the ability to easily edit (add/delete) fields in the form via Hubspot as our lead generation process evolves? Is this supported by both options?
*I have developers available to help with the integration, but they charge hourly. Can you give me a sense of how much dev work is needed to accomplish each option? Like most devs can get it done in 2 hours, some may take as much as 5, anything over 7 is weird. Cost is not the primary consideration, but something I need to know to scope the project and control costs.
An embedded HubSpot form will have all the functionality of a native form, including progressive profiling. The Forms API, on the other hand, is linked to a custom form which you or a developer would build. In this way, the Forms API can afford even more flexibility than a native or embedded HubSpot form, however it requires more development work.
An embedded HubSpot form can certainly be styled to match your website. Check out this overview article and this list of CSS selectors. Since the Forms API just handles the "back end" of a custom form (i.e. how it communicates with HubSpot), no styling is directly possible through the Forms API, but the developer or designer who built the custom form can use any kind of CSS or JavaScript to style it to match your website. Again, in this case, the Forms API would require more development work.
This is only possible with an embedded form. The Forms API must be connected to a custom form, so editing the form object it's connected to in HubSpot will do nothing to change the live content on your website.
I can confidently say that styling an embedded HubSpot form will take significantly less development hours than creating and styling a custom form before linking it to HubSpot with the forms API. That said, I can't specifically say how long it should take a skilled developer to complete the project.
Hi all, I just want to clarify something on Isaac's post above. Not all forms render within an iframe this only happens when a "Theme" is chosen on the form, and all forms on free and starter portals.
If you have a basic, pro or enterprise portal you can load all of your forms within your pages DOM. If you enable "unstyled form" within your form options then your embed script will load your forms HTML, unstyled within your page's DOM and not within an iFrame.
Nope, connecting a custom form to HubSpot with the Forms API will not enabled progressive profiling. In fact, the Forms API will have absolutely no effect on how visitors interact with your form — its only capability is to send information into HubSpot. If you need progressive profiling out-of-the-box, go with an embedded form.
Correct. The Forms API does not interact with the "physical" form in any way.
Yes, embedded forms are rendered through an <iframe>. Native HubSpot forms are not.
An embedded HubSpot form will have all the functionality of a native form, including progressive profiling. The Forms API, on the other hand, is linked to a custom form which you or a developer would build. In this way, the Forms API can afford even more flexibility than a native or embedded HubSpot form, however it requires more development work.
An embedded HubSpot form can certainly be styled to match your website. Check out this overview article and this list of CSS selectors. Since the Forms API just handles the "back end" of a custom form (i.e. how it communicates with HubSpot), no styling is directly possible through the Forms API, but the developer or designer who built the custom form can use any kind of CSS or JavaScript to style it to match your website. Again, in this case, the Forms API would require more development work.
This is only possible with an embedded form. The Forms API must be connected to a custom form, so editing the form object it's connected to in HubSpot will do nothing to change the live content on your website.
I can confidently say that styling an embedded HubSpot form will take significantly less development hours than creating and styling a custom form before linking it to HubSpot with the forms API. That said, I can't specifically say how long it should take a skilled developer to complete the project.
If the forms API is linked to a form that I've built outside of Hubspot (with the help of a developer), then how can I ensure that the form itself has the progressive profiling capabilities of Hubspot forms? The form I have in mind, that I'm building right now, just has static fields. I was counting on the magic of Hubspot to add progressive profiling because I don't know how to build a form with those capabilities on my own. If I'm reading your answer right, you're saying I can just build my static form, add Hubspot API, and suddenly my form has progressive profiling. Is that correct?
Re: styling the forms...so the Hubspot API won't interfere in any way with the way my form is styled, correct? Again, this is a form I've built (a WordPress form) with the help of a developer. So if I have my form live, styled beautifully, and then when I add the Hubspot API it makes zero impact to the styling/design, correct?
Is the embedded form achieved via an iframe?
Re: the hourly estimate, assume the form is already built. I'm trying to understand level of effort for developer to take existing form and go the embedded Hubspot form route vs go the API route.
.png "HubSpot Employee"){kind=icon}
