WordPress Integration

Connect your WordPress contact forms to StudioFlows and automatically capture leads from your photography website.

Contact Form 7

Contact Form 7 is one of the most popular free form plugins. To connect it to StudioFlows, you'll need an additional free plugin.

Step 1: Install the Webhook Plugin

1. Go to Plugins → Add New in WordPress
2. Search for "CF7 to Webhook" or "Contact Form 7 - POST to URL"
3. Install and activate the plugin

Step 2: Configure Your Form

1. Go to Contact → Contact Forms
2. Edit your form
3. Make sure your fields use these names in the form tags:

   [text* your-name]
   [email* your-email]
   [tel your-phone]
   [textarea your-message]

Step 3: Add the Webhook

1. In your form editor, look for a Webhook or POST URL tab
2. Enter your StudioFlows webhook URL:

   https://studioflows.app/api/leads/webhook?key=YOUR_KEY

3. Map your fields:
   • your-name → name
   • your-email → email
   • your-phone → phone
   • your-message → message
4. Save your form

Alternative: Use Zapier

If the webhook plugin doesn't work for you, use Zapier:

1. Install "Contact Form 7 Zapier Integration" plugin
2. Create a Zap: CF7 → Webhooks → POST to your StudioFlows URL

Gravity Forms

Gravity Forms has built-in webhook support with their premium add-on.

Option 1: Gravity Forms Webhooks Add-On (Paid)

1. Go to Forms → Add-Ons
2. Install the Webhooks Add-On
3. Edit your form
4. Go to Settings → Webhooks
5. Click Add New
6. Configure:
   • Request URL: Your StudioFlows webhook URL
   • Request Method: POST
   • Request Format: JSON
   • Request Body: Select fields and map to name, email, phone, message
7. Save the feed

Option 2: Use Zapier (No Add-On Needed)

1. Create a Zapier account
2. Create new Zap: Gravity Forms → Webhooks by Zapier
3. Set up the webhook to POST to your StudioFlows URL
4. Map your form fields

WPForms

WPForms requires their Webhooks add-on for direct integration.

Option 1: WPForms Webhooks Add-On (Elite Plan)

1. Go to WPForms → Addons
2. Install Webhooks Addon
3. Edit your form
4. Go to Settings → Webhooks
5. Enable webhooks and configure:
   • Request URL: Your StudioFlows webhook URL
   • Request Method: POST
   • Request Format: JSON
6. Map fields in the Body section

Option 2: Use Zapier (Any Plan)

1. Install Uncanny Automator (free) or use the native Zapier connection
2. Create a Zap: WPForms → Webhooks by Zapier
3. Configure the webhook to POST to StudioFlows

Elementor Forms

Elementor Pro forms have built-in webhook support.

Steps

1. Edit your page with Elementor
2. Select your form widget
3. Go to Actions After Submit
4. Click + Add Action
5. Select Webhook
6. In the Webhook section:
   • Webhook URL: Your StudioFlows webhook URL
   • Advanced Data: Enable if you want custom field mapping
7. Update the page

Ninja Forms

Ninja Forms requires the Webhooks add-on.

Steps

1. Purchase and install the Webhooks add-on
2. Edit your form
3. Go to Emails & Actions
4. Add new action: Webhook
5. Configure:
   • Remote URL: Your StudioFlows webhook URL
   • Remote Method: POST
   • Args: Map your fields
6. Save

Field Name Reference

Regardless of which plugin you use, map your form fields to these names:

Testing Your Integration

1. Submit a test form on your website
2. Go to your StudioFlows dashboard
3. Check Lead Follow-up for the new lead
4. If it doesn't appear, check:
   • Webhook URL is correct (including the ?key=... part)
   • Field mapping is correct
   • Your form has a "name" field

Common Issues

Form submits but lead doesn't appear

• Double-check the webhook URL - it must include ?key=YOUR_KEY
• Verify your form has a field mapped to name (required)
• Check if your WordPress has any security plugins blocking outgoing requests

Webhook plugin not sending data

• Make sure the plugin is activated
• Check for PHP errors in your WordPress debug log
• Try using Zapier as an alternative

SSL/HTTPS errors

• StudioFlows requires HTTPS - the webhook URL starts with https://
• If your WordPress site doesn't have SSL, that shouldn't affect outgoing webhooks