Home / Companies / Webflow / Blog / Post Details
Content Deep Dive

How to send Webflow form image uploads to the CMS as drafts with Zapier and Webflow Cloud

Blog post from Webflow

Post Details
Company
Date Published
Author
Ismail Ajagbe
Word Count
3,076
Company Posts That Month
27
Language
English
Hacker News Points
-
Post removed?
No
Summary

A Webflow Cloud and Zapier workflow can eliminate manual re-uploading of form-submitted images by sending each Webflow form submission’s public file URL to a Next.js Route Handler, which authenticates the request and creates a draft CMS item through the Webflow API. The setup requires a CMS collection with matching name, caption, and image fields, a file-upload form on an eligible Webflow plan, a write-enabled API token, a Zapier webhook, and a Next.js 15 project deployed through Webflow Cloud using npm. Uploaded files must have public link access enabled, use HTTPS, and meet the CMS’s 4 MB image limit, while the route uses a shared secret, validates payload data, ensures Webflow reports invalid files rather than silently omitting them, and generates unique timestamped slugs. Deployment requires storing tokens and configuration in environment variables, accounting for the Webflow Cloud mount path in the webhook URL, and mapping the form fields correctly in Zapier before testing a live submission. The process creates items as drafts for editorial review, but the basic shared-secret approach should be strengthened with rate limiting, replay protection, and signed time-bound verification for production use. Common problems include incorrect mounted URLs, mismatched CMS field slugs, inaccessible or unsupported images, accidental use of the unsupported Next.js edge runtime directive, and Node filesystem modules that do not work in Webflow Cloud’s Workers environment.

Trends Found in this Post
Trend Post Mentions Total Month Mentions Posts Companies MoM
Secrets Management 4 2,195 470 125 +7%
Edge Computing 3 107 30 11 +20%
Use This Data

Use this post, company, and trend context to find content marketing opportunities, perform competitive analysis, or address product feature gaps via the Plushcap MCP server or the Plushcap API.