Non-HubSpot Forms
Pushing data into non-HubSpot forms is the easiest, most hands-off approach, and it probably offers the best experience for end-users. All you need to do is install the HubSpot plugin (confusingly having the plugin slug of “leadin”), and log in to HubSpot from your WordPress dashboard. All form submissions to WordPress forms will now be sent over to HubSpot by the plugin. This includes all forms, hand-coded or made in form builders like Elementor, Gravity Forms, or Ninja Forms. At my agency, we generally use Gravity Forms, for reasons I will get into later. The plugin will automatically create a separate non-HubSpot form to pair with each form on your site.
HubSpot Forms
Using HubSpot forms to push form data to is slightly more involved or much more involved than using non-HubSpot forms. HubSpot forms are the “standard” forms you can build in HubSpot. Unlike non-HubSpot forms, HubSpot forms can be tied to campaign automation, have better analytics/reporting, etc.
There are two primary ways to leverage HubSpot form from WordPress, but to aid in the understanding of each, let’s talk about what constitutes a form in Hubspot-land. Of course, there’s much more to it than this, but for simplicity, we can understand Hubspot forms as a collection of 3 components: an ID, a form name, and some fields.
Embed Forms with an iFrame
A simple way to leverage HubSpot forms on your site is with iFrames. iFrames create a window from your contact page to the above form as rendered and hosted on HubSpot. Very easy to implement, since HubSpot provides embed codes that handle this for you. You can pretty much drop that code into the content of a page on WP and it will work.
Connect WordPress form to HubSpot API
Leveraging the HubSpot API we can send data back to HubSpot after we create a copy of the HubSpot contact form in our choice of WordPress form builder. To push the data to HubSpot we have to write some PHP code to catch form submissions as they come in and send them to Hubspot with a reference to the HubSpot form ID the data is going to. This way the submissions are identical to what you would get from the iFrame approach.
The code required to push form field data to HubSpot can be developed using the HubSpot API docs.
Which method is best for me?
There’s no one weird trick to bypass the soul-searching and introspection required to determine the best integration strategy. But I can help you soul-search and introspect more efficiently with two questions:
Do I need contacts in HubSpot to be connected to HubSpot forms?
If your answer is no, go install the Leadin plugin and use whichever form builder you want. There are no other real options to consider, stop reading this and go enjoy life.
If you do need contacts connected to HubSpot forms, you probably have a marketing person or department that has specific ways they use HubSpot’s automation, so you will also need to interact with HubSpot’s standard forms versus non-HubSpot forms. Read on.
So should I use iframes, or start reading the API docs?
This seems like a good time for a benefits vs drawbacks breakdown.
- iFrame Embeds
- benefits
- very easy to add to any page
- connect directly to HubSpot forms
- drawbacks
- slow loading
- can mess up page layouts in unexpected ways
- might cause problems related to responsiveness and accessibility
- benefits
- HubSpot API
- benefits
- As responsive/accessible as any WordPress form
- fast loading
- not an iFrame
- drawbacks
- will require a dev to set up the integration and add/edit integrated forms
- benefits
Embedding with iFrames is one of the easiest ways to use HubSpot forms, but an iFrame will slow down the loading of your form in a visible way for end users. Having a dev integrate the Hubspot API takes time but results in seamless integration, and the load speed is the same as any other part of WordPress. So the best answer would probably be API integrations where a form specifically needs to load fast, and iFrame embeds everywhere else. In practice, that means if you have a form that is above the fold, use the API. You don’t want an iFrame slowing things down and making the page appear visibly slower above the fold.
If visitors have to scroll down or click anywhere to make the form appear, you can probably iFrame in those forms. If the forms take their time loading in, it’s not going to seriously affect a visitor’s impression of how snappy your site is.
In Conclusion
HubSpot is a great CRM. You can pair HubSport with a great CMS, WordPress, in several ways. Hopefully, I’ve helped you decide how to best leverage HubSpot when using WordPress.
