Introduction
You can use the HTTP Integration to integrate to a variety of API Endpoints. An example of where you can do this is with Hubspot Forms.
If you are unable to integrate directly into a Hubspot instance using the direct Integrate to Hubspot job, then you may be able to do this using HTTP Integration.
While the integration mentioned above is the best way to submit leads into Hubspot securely and provide more transparency on a lead's status when being submitted, you may need to use the HTTP integration for the following reasons:
- Your client is unable to provide you access to the Hubspot instance required for direct integration
- Your client has provided you with an Hubspot form to submit to, which cannot be achieved with the direct integration
In general, you will be able to tell which integration you need by the data you've been provided:
- API Key, REST field names: Direct
- Form URL/Documentation: HTTP Integration
Below we will go through how to set up the HTTP Integration to submit data to a Hubspot Form.
Prerequisites
- Portal ID
- Form ID
- HTML Field Values
Please note, we will be using this version of the Hubspot API to complete this integration.
Setup Process
1. Within your HTTP Integration configuration, you need to input your API URL at the very top. For this, you need your Site ID.
For Hubspot Forms, the API URL always has the same format as seen in their provided documentation:
https://api.hsforms.com/submissions/v3/integration/submit/:portalId/:formGuid
In this URL, you will need to replace :portalId and :formGuid with the relevant IDs, as seen in the configuration window below.
Please note: Ensure that you remove the colons (:) from the URL. As mentioned above, leaving these in will lead to the integration failing.
Also ensure that your method is set to 'post', and send_as_json is set to 'Yes' as per the Hubspot document.
2. This Hubspot implementation requires a more advanced implementation of the HTTP Integration. To facilitate this, you will need to set send_body to 'Yes'.
3. The next area you need to populate is the mapping section. With Hubspot, they require their field mappings to be set up as a JSON body (example screenshot from Hubspot below):
The Mapping section of the integration cannot handle this, so you will need to input all of your fields into the bodyContent section.
Underneath this, you can add the fields section as below. Each new section requires a number, starting with 0.
In order to mirror the JSON body provided above, you will need to add each field as its own section of the integration. For the email field, it would look like this:
Here, the 'name' parameter refers to the Hubspot HTML field name that you want to map to. The 'value' parameter is the corresponding Convertr field name. This would submit the data point correctly as per Hubspot's instructions.
Please note: If the Convertr field name is the same as the Hubspot field name, this will not work without using our Integration Filters.
In the above example for email, 'email' is the field name for both Convertr and Hubspot. This will mean the lead data from that field will be pulled through for both 'name' and 'value', where it is only required for 'value'.
In this case, you need to use the |hardcode value to allow Convertr to ignore the lead data for the 'name' fieldvalue, as below:
You can then add your additional mapping underneath like this:
This is all that is required to send lead data to Hubspot! You can also include the context and legalConsentOptions from the JSON body if you or your client require data included there, but it should work like this.
This will complete your HTTP Integration to an Hubspot form! Please ensure to test and confirm with your client before beginning delivery through this integration.
Import from JSON
If you would like to copy an example of how this integration should look, you can import a JSON example into your HTTP configuration as a starting point by clicking Import from JSON in your HTTP job:
In here, you can copy the below JSON:
{
"api":{
"apiUrl":"https:\/\/api.hsforms.com\/submissions\/v3\/integration\/submit\/:portalId\/:formGUID",
"method":"post",
"send_as_json":"1",
"success_string":"",
"send_body":"1"
},
"headers":{
"":""
},
"OAuth":{
"url":"",
"access_token_key":"access_token",
"method":"",
"grant_type":"",
"client_id":"",
"client_secret":""
},
"bodyContent":{
"fields":[
{
"objectTypeId":"0-1",
"name":"email",
"value":"example@example.com"
},
{
"objectTypeId":"0-1",
"name":"firstname",
"value":"Jeff"
}
],
"context":{
"hutk":":hutk",
"pageUri":"www.example.com/page",
"pageName":"Example page"
},
"legalConsentOptions":{
"consent":{
"consentToProcess":true,
"text":"I agree to allow Example Company to store and process my personal data.",
"communications":[
{
"value":true,
"subscriptionTypeId":999,
"text":"I agree to receive marketing communications from Example Company."
}
]
}
}
},
"recipients":[
"john@gmail.com",
"jane@gmail.com"
]
}
Once you click Save, this will update your HTTP job to show this configuration. You can then make changes to suit your needs.
For more information on how you can use the HTTP Integration, see here.