Hello, my name is Lucas Dantas and today I will show you how you can integrate your Elementor forms with Hubspot CRM.
The first thing you need to do is to create an Integrately account. Integrately is free up to 5 automations, if you have more than 5 forms in your website that you need to integrate with Hubspot, my advice would be signing up for the Starter edition.
Use this link to register so you can help our blog to grow.
Now that you have an account, let’s start. Let’s begin with logging into Integrately.
Click in My Automations and then click on New Automation.
In the next screen, you will choose the applications you want to work with.
Choose Elementor Forms in the first one.
And choose Hubspot in the second one.
Scroll down to the bottom of the page and you will see something similar to the screenshot below.
Choose the options:
- Form is submitted in Elementor Forms
- Create contact in Hubspot
Then click on Go.
In the next screen, copy the webhook URL by clicking on the Copy button.
Now you have to go the page where your Elementor form is located. If you have more than one form, keep in mind that you have to create an automation for every single one of them. Follow the same steps for each one of them and at the end, all of them will be integrated.
When you edit your Elementor form, go to the left panel and look for Actions after submit. In this section, you have to add Webhook and after it has been added, a new section will be created.
Paste the webhook URL in the section called Webhook and click on Update to publish the changes.
After you have done this, click on I have set this URL in Elementor Forms.
Now go to the page you have published and submit a dummy lead so Integrately can test and pull up the data from the form. Make sure you have filled out all the fields and then after submitting it, click on Done. Check if received.
If you have done this correctly, you will see the green check mark and you will be advanced to the next screen.
If you see this prompt, click on No.
The next step is to connect Hubspot with Integrately. Click on Add connection button located in the step 2 of your automation like shown below.
Then click on Continue to submit your login credentials.
Make sure you have super admin permissions, otherwise you will see this error below related to your permission.
After you have provided credentials you will see something similar to the screen below.
If you have multiple Hubspot accounts, I recommend naming them so you know which one you are using for each integration.
Now it’s the most important part.
In the left side, you will the information you have submitted when you tested the form right after setting it up with Webhook URL so it’s important that you have filled out the fields so we can map them appropriately here.
To map the fields, you have to click in front of each one of the fields you wish to map. Your cursor should be where it says Map field(s) or type value and then click on the respective field in the panel located by the right side.
In the screen above, I demonstrate how I mapped the field email. I clicked on Work email and then selected Email field.
After you have mapped all the fields, click on Test & Activate.
You can submit another test, but you don’t have to if you have follow all the steps correctly.
Congratulations! You have integrated your Elementor form with Hubspot.
If you would like to learn more about integrations, stay tuned to this blog.
