Trello

How to integrate Trello with Webflow

Trello-Webflow integration converts form submissions into project cards, tracks content workflows through your CMS, and coordinates project milestones across teams. Most teams use automation platforms like Zapier or n8n for reliable connections without custom code.

You can display Trello boards and cards on your Webflow site using embed code, automate workflows through platforms like Zapier and n8n, or build custom integrations with both platforms' APIs for specialized requirements.

Display Trello content with embed code

Trello provides official embed code for displaying boards and cards on your Webflow site. Add the embed code to Custom Code Embed elements in Webflow to show board or card content visually.

These embeds display Trello content but don't enable data synchronization or workflow automation. For bidirectional data flow where form submissions create Trello cards or CMS updates trigger tasks, use automation platforms or custom API integration instead.

Use automation platforms (Zapier, n8n)

Automation platforms connect Webflow and Trello without custom code. Set up triggers in Webflow that automatically create or update Trello cards. Zapier offers pre-built Webflow-Trello templates for common workflows, while n8n provides advanced customization options for complex requirements.

These platforms handle authentication and error handling automatically through visual interfaces that connect Webflow events to Trello actions.

Some common automation patterns using Trello and Webflow include the following:

• Convert client contact forms into tasks on specific boards
• Track new blog posts, products, or portfolio items that need review when you publish your site
• Update project boards when sites go live

Important limitation: Webflow triggers webhooks on site publish events, not individual CMS item creation. Trello tasks are created when you publish your site, not immediately when CMS items are created. Form submissions trigger webhooks in real time.

Review your automation platform's task limits to understand how triggered workflows count against your plan quotas. Design workflows to trigger only on meaningful events rather than every minor change. For high-volume scenarios or complex data transformations, custom API integration offers more control.

Build with Webflow and Trello APIs

For workflows beyond automation platform capabilities, build custom integrations using the Webflow Data API and Trello REST API. Custom integration requires middleware that authenticates with both platforms, transforms data between Webflow's JSON structure and Trello's card format, and handles error cases like rate limiting or network failures.

This approach provides complete control over data flow, custom business logic, and specialized workflows that pre-built templates cannot support. Custom integration requires significant development time for basic implementations including authentication setup, connecting to API endpoints, and error handling logic.

Form submissions to Trello cards

Convert Webflow form submissions into Trello cards by setting up a webhook that receives form data and creates cards through the Trello API. Your middleware server receives the webhook POST request from Webflow, extracts form field values from the payload, and sends a POST request to Trello's cards endpoint with the transformed data.

Get your Trello API credentials from the Trello Power-Ups admin area, including your API key and token. Find your target board and list IDs by adding .json to your Trello board URL and searching the response for your list name. Configure a Webflow webhook for form submissions that points to your server endpoint.

Your server transforms the form data into Trello card format with name, description, list ID, and optional parameters like due dates, assigned members, or labels. Handle authentication by including your Trello API key and token in the request URL. Implement error handling for rate limits (300 requests per 10 seconds per API key) and network failures with retry logic.

Site publish events to project updates

Track site publishing activity in Trello by creating cards or adding comments when your Webflow site goes live. Register a webhook for the site_publish trigger type, which fires when you publish your entire site.

The webhook payload includes the publish timestamp, publishing user, and domain information. Use this data to add timestamped comments to existing Trello cards, move cards between lists to reflect project status, or create new milestone cards on project boards.

Note: Webflow triggers webhooks on full site publishes, not individual page or CMS item publishes. Design your workflow around complete site deployments rather than incremental content updates.

What you can build

Integrating Trello with Webflow gives you project visibility across design, development, and client collaboration workflows.

• Form submission tracking: Convert Webflow form submissions into Trello cards on designated boards for client request management
• Content workflow coordination: Generate Trello tasks when you publish CMS changes, helping editorial teams track blog posts, products, or portfolio items through publication
• Project milestone updates: Update Trello boards automatically when Webflow sites are published or moved between staging and production
• Client feedback management: Route form submissions from specific Webflow pages to client-specific Trello boards for organized request handling