Implement Webflow webhook registration, signature verification, and event handling
for form_submission, site_publish, ecomm_new_order, page_created, and more.
Use when setting up webhook endpoints, implementing event-driven workflows,
or handling Webflow notifications.
Trigger with phrases like "webflow webhook", "webflow events",
"webflow webhook signature", "handle webflow events", "webflow notifications".
Standardmäßig ist der Prompt ausgewählt, der zuerst die Quelle prüft. Sie können zu einem direkten Befehl wechseln oder eine lokale Kopie herunterladen.
Quelldateien prüfen
Lesen Sie SKILL.md und alle von SkillsMP angezeigten Begleitdateien, bevor Sie sich für eine Installation entscheiden.
Mit Codex oder Claude installieren Kopieren Sie diesen Prompt, fügen Sie ihn in Codex, Claude oder einen anderen Assistant ein und lassen Sie die Skill-Seite prüfen und installieren.
Ein direkter Befehl überspringt den Prüf-Prompt. Prüfen Sie die Quelle, bevor Sie ihn ausführen.
Implement Webflow webhook registration, signature verification, and event handling
for form_submission, site_publish, ecomm_new_order, page_created, and more.
Use when setting up webhook endpoints, implementing event-driven workflows,
or handling Webflow notifications.
Trigger with phrases like "webflow webhook", "webflow events",
"webflow webhook signature", "handle webflow events", "webflow notifications".
allowed-tools
Read, Write, Edit, Bash(curl:*)
version
1.5.0
license
MIT
author
Jeremy Longshore <jeremy@intentsolutions.io>
tags
["saas","design","no-code","webflow"]
compatibility
Designed for Claude Code
Webflow Webhooks & Events
Overview
Register, verify, and handle Webflow Data API v2 webhooks. Covers all trigger types,
HMAC signature verification, idempotent processing, and event routing patterns.
Prerequisites
Webflow API token with sites:write scope (for registering webhooks)
HTTPS endpoint accessible from the internet
crypto module (Node.js built-in)
Redis or database for idempotency (optional)
Webhook API Reference
Operation
Method
Endpoint
List webhooks
GET
/v2/sites/{site_id}/webhooks
Create webhook
POST
/v2/sites/{site_id}/webhooks
Get webhook
GET
/v2/webhooks/{webhook_id}
Delete webhook
DELETE
/v2/webhooks/{webhook_id}
Limits: Max 75 webhook registrations per triggerType per site.
Supported Trigger Types
triggerType
Description
Payload
form_submission
Form submitted on site
Form data, submitter info
site_publish
Site published
Site ID, publish domains
page_created
New page created
Page ID, title, slug
page_metadata_updated
Page SEO/meta changed
Page ID, updated fields
page_deleted
Page removed
Page ID
ecomm_new_order
New ecommerce order
Order details, items, customer
ecomm_order_changed
Order status updated
Order ID, new status
collection_item_created
CMS item created
Collection ID, item data
collection_item_changed
CMS item updated
Collection ID, item data
collection_item_deleted
CMS item removed
Collection ID, item ID
collection_item_unpublished
CMS item unpublished
Collection ID, item ID
Instructions
Step 1: Register Webhooks via API
import { WebflowClient } from"webflow-api";
const webflow = newWebflowClient({
accessToken: process.env.WEBFLOW_API_TOKEN!,
});
const siteId = process.env.WEBFLOW_SITE_ID!;
const webhookUrl = "https://your-app.com/webhooks/webflow";
asyncfunctionregisterWebhooks() {
const triggerTypes = [
"form_submission",
"site_publish",
"ecomm_new_order",
"collection_item_created",
"collection_item_changed",
];
for (const triggerType of triggerTypes) {
const webhook = await webflow.webhooks.create(siteId, {
triggerType,
url: webhookUrl,
// form_submission supports filtering to a specific form
...(triggerType === "form_submission" && {
filter: { name: "contact-form" }, // Filter by form name
}),
});
console.log(`Registered: ${triggerType} -> ${webhook.id}`);
}
}
// List existing webhooksasyncfunctionlistWebhooks() {
const { webhooks } = await webflow.webhooks.list(siteId);
for (const wh of webhooks!) {
console.log(`${wh.triggerType}: ${wh.url} (${wh.id})`);
}
}
// Delete a webhookasyncfunctiondeleteWebhook(webhookId: string) {
await webflow.webhooks.delete(webhookId);
}
Step 2: Webhook Endpoint with Signature Verification
# Terminal 1: Start your server
npm run dev
# Terminal 2: Expose via ngrok
ngrok http 3000
# Copy the https:// URL# Terminal 3: Register test webhook
curl -X POST "https://api.webflow.com/v2/sites/$WEBFLOW_SITE_ID/webhooks" \
-H "Authorization: Bearer $WEBFLOW_API_TOKEN" \
-H "Content-Type: application/json" \
-d "{
\"triggerType\": \"form_submission\",
\"url\": \"https://your-ngrok-url.ngrok.io/webhooks/webflow\"
}"# Now submit a form on your Webflow site — the webhook will hit your local server
Output
Webhook registrations for all needed trigger types
HMAC-SHA256 signature verification on every request
Type-safe event router handling all Webflow events