How to Integrate Elementor with HubSpot

HubSpot is a popular online CRM software. You can use it to maintain your relationship with your customers. Before doing so, you need to build the customer database on your HubSpot account. You can create forms to generate leads and turn the leads into your customers. If you use Elementor, you can use the Form widget to create a form and connect it with your HubSpot account to generate leads. This article will show you how.

Integrating Elementor and HubSpot is pretty easy as HubSpot offers a WordPress plugin that you can use to integrate your HubSpot account with your WordPress site. Especially for Elementor, the plugin allows you to connect an Elementor form to your HubSpot account. Just like email marketing tools such as MailChimp and MailerLite.

Integrating Elementor and HubSpot

Install the HubSpot plugin

Before installing the HubSpot plugin on your WordPress site, you need to enable the Collect data from website forms option on your HubSpot account. To do so, visit the HubSpot website and login with your account. Click the Marketing menu and select Forms.

Click the Non‑HubSpot Forms and make sure this option is enabled. If it is not, you can click the settings link to enable it.

Once done, you can start installing the HubSpot plugin. From your WordPress dashboard, go to Plugins -> Add New. Type “hubspot” on the search box to find the HubSpot plugin. Once you found it, click the Install Now button to install it to your WordPress site. Activate the plugin right away once installed.

Once the plugin is activated, you will see a new menu item called HubSpot on your WordPress dashboard. Click it. Login with your HubSpot account by clicking the Sign in here link on the upper-right corner. Continue by clicking the Continue with this account button.

HubSpot is now connected with your WordPress site. No need to enter the API key just like when you are integrating MailChimp and other email marketing tools.

Create an Elementor form to collect leads with HubSpot

Once done with the steps above, you can create a new form (or edit an existing one) to collect leads and save them (the leads) to your HubSpot account.

To create a form, first, create a new page by going to Pages -> Add New and edit it with Elementor. On the Elementor editor, drag the Form widget from the left panel to the canvas area.

Go to the left panel to customize the form. Set the fields you need on the Form Fields block under the Content tab. You can also give your form a name from this block.

Open the Additional Options block and set an ID form your form. Form ID cannot contain a space character.

Publish/update your page once you are done editing it. Next, you can test the form you have just created by filling it out. To test if the form has worked, visit the HubSpot website and go to Marketing -> Forms. Make sure your new form is on the list.

Next, go to Contacts -> Contacts. If you the submission you have just submitted appears here, everything has gone well.

This page may contain affiliate links, which help support our project. Read our affiliate disclosure.
Want to save yearly expense up to $219? why not?

3 thoughts on “How to Integrate Elementor with HubSpot”

  1. This is what I have been looking for. Thanks for writing this bro. I use both Elementor and HubSpot on my WordPress site and the integration between the two is great!

  2. How do you connect Elementor Pro Form fields to the property fields within Hubspot? Basic fields such as name, email, and message went through, but others such as organization and newsletter opt-in options are shown as a warning in Hubspot. It states that the values are not passed into the contact record.


Leave a Comment

Haven’t used Elementor Pro yet?