Send Webhook Forms to HubSpot with Zapier (3.0)

This Zap handles multiple Webhook Forms. Our example shows Website Leads Form and Contact Us Form. Both forms share some setup steps with the Send Webhook Data to HubSpot with Zapier Doc, so here we’ll only highlight the differences.

It may be useful to create the Zap first without the steps below so that you can send in test data per each of your forms so that you will have the data to map in the subsequent steps.

Step 1 — Catch the Webhook

Same as in the standard setup — Zapier listens for incoming form data.

Step 2 — Split into Paths

Add a Paths by Zapier step.

This lets you branch the Zap depending on which form the webhook data came from. Our example shows two forms but you will need as many paths as Custom Forms.
Create a path per form.

Step 3 — Path Conditions

Define rules so this path only runs when the submission comes from the Website Leads Form. Using Custom rules, map Form Name to the Form Title, in this example Website Leads.

Step 4 — Code by Zapier

Use Code by Zapier to Run JavaScript to parse the Forms input field. While the following fields may be a part of your Fields, they can be ignored as they are already mapped to standard fields:

First Name
Last Name
Email
Phone Number

Zapier will run this JavaScript automatically. Ingestion data can also be found in Anewgo Console > Admin > Integrations > Webhooks by searching for the webhook event. This will give you the order the fields are being sent.

Before (raw data from the form):

Riley,Ellingson,riley@email.com,123-456-7890,Acme Inc,Hello I’m interested in your product

1	Riley,Ellingson,riley@email.com,123-456-7890,Acme Inc,Hello I’m interested in your product

After (cleaned data from JavaScript):

{
  company: "Acme Inc",
  message: "Hello I’m interested in your product"
}

{

company: "Acme Inc",

message: "Hello I’m interested in your product"

}

This step takes a messy string of form data, splits it into pieces, and extracts just the Company and Message fields so they can be mapped into HubSpot.

Here’s the exact code used in this step:

const values = inputData.fields.split(',');
const company = values[4];
const message = values[5];

return { company, message};

const values = inputData.fields.split(',');

const company = values[4];

const message = values[5];

return { company, message};

Remaining Steps

Format the phone number
Create or Update the Contact in HubSpot – additional values generated by the JavaScript step can be mapped to HubSpot.

HubSpot Tracking Cookie

The hubspotutk unique tracking code can also be added to each form.