Integrations

Webhook Integration

Connect any form or service to StudioFlows using webhooks. Automatically capture leads from your website, CRM, or any platform that supports webhooks.

What is a Webhook?

A webhook is a way for one application to send data to another automatically. When someone fills out your contact form, the form can instantly send that information to StudioFlows.

No coding required! Most form builders have built-in webhook support. You just need to paste your webhook URL.

Find Your Webhook URL

  1. Go to Lead Follow-up in your dashboard
  2. Click the Settings icon (gear)
  3. Scroll down to find your unique webhook URL

Your webhook URL looks like this:

https://studioflows.app/api/leads/webhook?key=YOUR_UNIQUE_KEY
Keep your webhook key private! Anyone with your webhook URL can create leads in your account. Don't share it publicly.

How to Connect

The connection process varies depending on your form platform. Here are instructions for popular options:

Form Builders

Platform How to Connect
Typeform Connect tab → Webhooks → Add webhook URL
Jotform Settings → Integrations → Webhooks → Add
Tally Integrations → Webhooks → Paste URL
Formspark Form Settings → Webhook URL
Formspree Form Settings → Plugins → Webhook
Google Forms Requires Google Apps Script or Zapier (see below)

Website Platforms

Platform How to Connect
WordPress See our WordPress Integration Guide
Squarespace Use Zapier to connect forms (native webhooks not supported)
Wix Automations → Add trigger → Form submitted → Send webhook
Webflow Project Settings → Integrations → Webhooks
Showit Use your form provider's webhook (Formspark, Jotform, etc.)

CRM Systems

Most CRMs can send webhooks when new contacts are added or forms are submitted:

  • HubSpot - Workflows → Send webhook action
  • Pipedrive - Automations → HTTP request action
  • Zoho CRM - Workflow Rules → Webhook
  • Salesforce - Process Builder → HTTP Callout

See our CRM Integration Guide for detailed instructions.

Data Format

StudioFlows accepts data in JSON or form-encoded format. The webhook automatically recognizes common field names:

Accepted Field Names

Field Accepted Names Required?
Name name, Name, full_name, fullName, client_name Yes
Email email, Email, email_address, e-mail No
Phone phone, Phone, phone_number, tel, mobile No
Notes message, Message, notes, comments, inquiry No

Example JSON Payload

{
  "name": "Sarah Johnson",
  "email": "sarah@example.com",
  "phone": "(555) 123-4567",
  "message": "Interested in headshot photography for my team"
}

Testing Your Webhook

Before going live, test your webhook to make sure it's working:

Method 1: Use the GET Request

Visit your webhook URL in a browser. If the key is valid, you'll see:

{
  "status": "ok",
  "message": "Webhook key is valid. Ready to receive leads."
}

Method 2: Send a Test POST Request

Use a tool like ReqBin or Postman:

  1. Set method to POST
  2. Enter your webhook URL
  3. Set Content-Type header to application/json
  4. Add a test payload: 
    {
  "name": "Test Lead",
  "email": "test@example.com"
}
  5. Send the request
  6. Check your Lead Follow-up page for the new lead

Method 3: Submit Your Own Form

Fill out your contact form with test data and verify the lead appears in StudioFlows.

Troubleshooting

Lead not appearing?

  • Check the webhook key - Make sure you copied the full URL including ?key=...
  • Check field names - Ensure your form has a field named name or Name
  • Check your form settings - Make sure webhooks are enabled and the URL is saved

Getting an error response?

Error Solution
Missing webhook key Add ?key=YOUR_KEY to the URL
Invalid webhook key Check your key in Lead Follow-up Settings
Name is required Ensure your form includes a "name" field

Using Zapier or Make

If your form platform doesn't support webhooks directly, use Zapier or Make (Integromat) as a bridge:

  1. Create a new Zap/Scenario
  2. Set your trigger (e.g., "New Form Submission" from your form app)
  3. Add action: "Webhooks by Zapier" (or HTTP module in Make)
  4. Method: POST
  5. URL: Your StudioFlows webhook URL
  6. Data format: JSON
  7. Map fields: name, email, phone, message

See our Zapier & Make Guide for detailed instructions.

Advanced: Custom Field Mapping

If your form uses non-standard field names, you have two options:

  1. Rename fields in your form - Change field names to match the accepted names
  2. Use Zapier/Make - Map your custom fields to the standard names
Pro tip: When setting up forms, use simple field names like name, email, and phone for easier integration with any service.
Getting Started WordPress Integration

Powered by MHamiltonVisuals