Custom Webhooks
What is Webhooks
Webhooks are a way for applications to send real-time notifications or data to other applications. They are used to automate the exchange of information between different systems. When an event or trigger occurs in one application, it sends a POST request to another application's specific URL (the webhook), providing data about the event. The receiving application can then process this data and take appropriate actions.
Webhooks integration lets you contact your calculator with applications like Zapier, Make, and IFTTT. These automation tools enable you to automate repetitive tasks by connecting two or more apps.
Advantages, Features, and Practical Use Cases
Collect user emails and send newsletters.
Send a lead to a specific employee based on the services selected in the cost calculator.
Deliver automated text messages to your potential customers.
Export orders, and quotations to Google Sheets.
Arrange leads and quotation forms within Google Sheets.
Generate a contact in your CRM.
Get notified on Slack.com about a new lead.
Personalize the Email Quote form by deactivating the default Contact form and instead send it manually using Zapier. Utilize the information from the webhook to structure the email according to your preferences.
How to Activate and Utilize This Functionality
Webhooks can be added for individual calculators by editing their settings:
To use the Webhooks feature simply navigate to calculator settings and enable one of the available events:
Enter the received link from the automation service and send the demo data to check the connection
The integration works with the following events:
Each event requires certain settings to be enabled on the calculator. When corresponding settings was disabled you will be informed in the form of a notice.
When Contact Form submitted
The Data will be sent to the external application when a user submits the contact form:
This event requires the contact form to be enabled.
If you are using Contact Form 7, our webhooks won't work. Contact Form 7 can integrate with other systems and platforms with the webhook plugins. Read more about the webhooks in Contact Form 7.
When a user clicks the Payment button
The event will run when the user makes a payment through one of the available payment methods such as Stripe and Paypal:
This event requires one of the payment methods: Stripe or PayPal checkout to be enabled.
The event "When a user clicks the Payment button" is not available when WooCoommerce checkout is enabled.
When PDF Quote is emailed
The Data will be sent to the external application when users send email generated pdf quotes:
This event requires the PDF Entries to be enabled.
How to export Calculator Data to Google Sheets using Zapier
Let's review real-life examples that demonstrate the usage of Webhooks. Imagine, you are going to save all orders that were made using the Cost Calculator in Google Sheets to access it everywhere.
To do this, you need to follow simple steps and configure the applications involved.
Step 1. Google Sheet preparation to receive data
Once logged into your Google account, create a spreadsheet based on your business needs.
Our table above almost duplicates with additional columns default Cost Calculator orders.
Step 2. Getting Webhook from Zapier
Zapier is an online automation tool that allows users to connect various web applications together and automate workflows. We will use this service to get webhooks, so you should authorize on the site or register if you have not an account yet.
After logging in to Zapier, we should create a new "Zap" from the dashboard:
From the triggers list select "Webhooks by Zapier"
"Webhooks by Zapier" is available in the Premium plan of Zapier, and you can check the pricing by clicking the link below.
Next, choose "Catch Hook" as an event and click on the "Continue" button.
In the triggers tab, leave empty "Pick off a Child Key" and click on the "Continue" button:
On the opened "Test" tab copy out the webhook URL:
Done, now this webhook should be added to our calculator. Click on the "Test trigger" button and wait for dem data after adding the webhook into the calculator.
Step 3. How to Add Custom Webhook into Calculator
On the Cost Calculator dashboard, simply edit the calculator where you want to add webhooks:
Navigate to calculator settings and enable one of the available events. We will send data when the user makes a payment. So we enabled the "When user clicks Payment button" event and added the webhook URL that was copied in the previous step:
Click on the "Send demo data" button to complete the connection between Zapier and Calculator by sending sample data.
Important! If you add or remove fields in your calculator, you must resubmit the data and update the settings in the automation service.
Go to the Zapier and make sure that you received demo data successfully:
Next, simply click on the "Continue with selected record" button to continue working on Zapier and add Actions to utilize the received demo.
Step 4. Adding Actions into Zapier to send data Google Sheet
From the actions list select "Google Sheets":
From the events list select "Create Spreadsheet Row" to automatically add new rows to our table when users create new orders:
Connect your Google Account to access the sheet that was created in the 1st step. if connected click on the "Continue" button:
Next, find the Spreadsheet from your Google Drive and select Worksheet, where data will be added:
As soon as you find Worksheet, the rows will be available to fill with our data:
Fill in the fields with demo data by simply clicking on them and selecting the corresponding variables:
After filling out rows click on the "Test action" button to send the sample date to our Spreadsheet.
If the test passed successfully, you can "Publish" the Zap.
The sample data can be seen in Googe Spreadsheet.
The "Zap" that was created can be managed in the Zapier user account dashboard. You can make edits by adding new actions or disable.
Step 5. Testing Webhook from on page with Calculator
Let's make final tests by creating order as a regular user on your website:
If we check our spreadsheet, we can see that a new row has been added with order details:
Additional Information
Using webhooks, you can experiment with various actions utilizing diverse automation tools. Integration extends beyond the mere transmission of order details to Google Spreadsheets via Zapier.
Last updated
