Hero header for a tutorial: sending WordPress form data to an API via webhooks, with a bear avatar and a blue API icon on beige background.

How to Send WordPress Form Data to Any API With Webhooks

WPForms has an addon for about forty services. Mailchimp, Salesforce, Stripe, Google Sheets, and the rest of the usual stack are one setup screen away. Your client’s internal booking system isn’t.

The Webhooks addon covers that gap. It takes a form submission and sends it as an HTTP request to any URL you point it at, in the format the receiving API expects. This tutorial walks through the setup: getting the endpoint details, mapping your fields, adding authentication, and testing it before a real submission depends on it.

Build Your WordPress Form Now

How to Send WordPress Form Data to Any API With Webhooks

A visitor submits your form. WPForms shapes the answers into an HTTP request the way your API wants it, adds your authentication header, and sends it. Your entry still saves in WordPress either way.

When a Webhook Is the Right Tool

Check for a native addon first. Mailchimp, Salesforce, Google Sheets, Notion, Airtable and about forty others connect in a few clicks, and those connections run deeper. Zapier, Make, and n8n cover the long tail of SaaS apps, with a per-task cost and one more account in the chain.

Webhooks are for the rest: a proprietary internal system, a regional service, a client’s custom backend, an endpoint you wrote yourself. They also have no transfer cap, so a form taking 4,000 submissions a month costs the same as one taking 40.

What You’ll Need

  • WPForms Elite (the Webhooks addon is included at this license level)
  • A form on your site
  • The receiving API’s documentation

You won’t write any code. All of this happens in the form builder.

Dashboard screenshot of Webhooks settings with Enable Webhooks on and a Dispatch API form (URL, POST, JSON, secret) and header/body fields.

Step 1: Get the Details From the API

Skipping this step is why most webhooks fail on the first try. From the API docs, write down:

  1. The endpoint URL, like https://api.example.com/v1/deliveries
  2. The request method, usually POST for creating a record
  3. The authentication method, usually a key in a header such as Authorization: Bearer YOUR_KEY
  4. The exact parameter names. If the API expects customer_email and you send email, the request succeeds and the value disappears.

Running example: a florist client whose delivery dispatch system takes new orders at that endpoint via POST and expects customer_name, customer_email, customer_phone, arrangement, quantity, and order_total. No WordPress plugin exists for it, which is exactly when you reach for a webhook.

Step 2: Install the Addon and Turn It On

Go to WPForms » Addons, search for Webhooks, and click Install Addon. It activates itself.

WPForms dashboard: Activated Webhooks addon card with description.

Then open your form, click Settings » Webhooks, and toggle Enable Webhooks on.

UI screenshot of a Settings page showing the Webhooks section with an Enable Webhooks toggle and a large red scribbled arrow on a white canvas

Click the pencil icon to rename it something you’ll recognize later, like “Dispatch API.”

Step 3: Set the Request URL, Method, and Format

Next, configure these settings:

Request URL. Paste the endpoint. Watch the version segment, since /v1/ and /v2/ are easy to mix up.

Request Method. GET, POST, PUT, PATCH, or DELETE. POST creates a new record and covers most setups.

Request Format. JSON sends application/json and suits most modern APIs. FORM sends application/x-www-form-urlencoded, so use it only when the docs ask. When in doubt, JSON.

Screenshot of API request editor: shows URL https://api.example.com/v1/deliveries, POST method, JSON format, with a dark left navigation pane.

Step 4: Add Your Authentication Headers

Finally, add your authentication headers.

Request Headers takes key/value pairs. For a bearer token, use Authorization as the key and Bearer YOUR_TOKEN as the value. For a custom header, use whatever name the docs give, like X-API-Key. Add as many rows as you need.

The Secret field works the other way around, and WPForms fills it in for you. It signs each outgoing request so the receiving server can confirm the data really came from your site. Use it when you control the endpoint and can check the signature; most third-party APIs ignore it.

Screenshot of a developer UI: left navigation (PDF, Surveys and Polls, Form Abandonment) and right pane showing Request Headers with Authorization: Bearer sk_demo_1234567890

Treat the header value like the credential it is. Anyone with builder access can read it, so scope client API keys narrowly and rotate them when someone rolls off the project.

Build Your WordPress Form Now

Step 5: Map Your Form Fields

Request Body is where the form meets the API. Each row pairs a parameter name you type with a form field you pick:

  • customer_name → Name
  • customer_email → Email
  • customer_phone → Phone Number
  • arrangement → Arrangement
  • quantity → Quantity
  • order_total → Total
Webhooks page with left nav; Request Body form listing customer_name, customer_email, customer_phone, arrangement, quantity, order_total.

Copy the key names straight from the docs. Capitalization and underscores matter, and a mismatch gives you a request that succeeds while dropping the value.

Checkboxes, multi-selects, and address fields send values separated by a double pipe (||), so split that string server-side if the API wants an array.

Choose Add Custom Value to send something that isn’t a form field, like a static source parameter or a smart tag for the entry ID.

Step 6: Add Conditional Logic (Optional)

Toggle Enable Conditional Logic to control when the webhook fires. You might send only one arrangement type to the dispatch API, or hold back orders that don’t need delivery at all. For two destinations, click Add New Webhook and give each one its own rule.

Admin panel: Webhooks settings with conditional logic enabled; rule checks if Arrangement equals Rose Bouquet, with an Add New Group option and a floating action button.

Step 7: Test Before You Go Live

Test in two passes.

First, send to a request inspector. Webhook.site and RequestBin generate a temporary URL that shows exactly what arrived. Paste it into Request URL, save, and submit the form. Your headers and payload show up immediately, which tells you whether the key names are right.

Then switch to the real endpoint, submit again, and confirm the record landed. Check WPForms » Entries too.

If you’re stuck, go to WPForms » Tools » Logs, toggle Enable Logs, and check Providers and Errors under Log Types. Submit again and the log shows the API’s response. Turn logging back off afterward, since those entries can hold data you don’t want sitting on the server.

WPForms Log Settings in WordPress admin with Enable Logs toggle and Save Settings button.

Common Webhook Errors

  • 401 or 403. Authentication: wrong key, expired key, missing Bearer prefix, or wrong header name.
  • 404. The URL: typo, missing version segment, or a trailing slash the API rejects.
  • 400 or 422. The API got the request and rejected the contents, usually a missing required parameter or an unparseable date.
  • 200 but nothing appears. Key name mismatch: the API accepted the request and ignored the fields it didn’t recognize.
  • Nothing fires. Check conditional logic: on multi-page forms the webhook runs once, after the final submit.

FAQs About Sending WordPress Form Data to an API

Which WPForms plan includes the Webhooks addon?

Elite. That tier also covers Salesforce, Authorize.Net, ActiveCampaign, and Airtable, which is why it’s where agencies doing custom integration work usually land.

Do I need to know how to code to use webhooks?

No. Everything happens in the WPForms builder. You just need to read the API’s documentation well enough to find its URL, authentication method, and parameter names.

What’s the difference between webhooks and the Zapier or Make addons?

Zapier and Make sit between your form and the destination, buying you multi-step workflows and a big catalog of connections for a per-task cost. A webhook goes straight to the endpoint, works with any API, and doesn’t meter submissions.

Can one form send data to more than one API?

Yes. Click Add New Webhook and configure the second connection with its own URL, headers, and mapping. Each one can carry its own conditional logic.

How do I send an API key with my form data?

Add it in Request Headers as a key/value pair. Most APIs want Authorization and Bearer YOUR_KEY, though some use a custom name like X-API-Key.

What happens if the API is down when someone submits my form?

The submission still completes and your entry and notifications go through, since the webhook is a separate request. Only the webhook fails, so add monitoring on the receiving end for anything business-critical.

Next, Route Your Submissions to the Right Place Automatically

With the API connection working, the next piece is routing around it, so quote requests, support questions, and newsletter signups each go somewhere different on their own. How to Route Form Submissions to Different Lists and Tools Based on Answers has the walkthrough.

Build Your WordPress Form Now

Ready to build your form? Get started today with the easiest WordPress form builder plugin. WPForms Pro includes lots of free templates and offers a 14-day money-back guarantee.

If this article helped you out, please follow us on Facebook and Twitter for more free WordPress tutorials and guides.

Disclosure: Our content is reader-supported. This means if you click on some of our links, then we may earn a commission. See how WPForms is funded, why it matters, and how you can support us.

Kacie Cooper

Kacie writes for the blog and oversees the weekly newsletter at WPForms, and also has a soft spot for creating fun form templates. She has been blogging on WordPress and writing about it since 2016. Learn More

The Best WordPress Drag and Drop Form Builder Plugin

Easy, Fast, and Secure. Join over 6 million website owners who trust WPForms.