Brevo (formerly Sendinblue)

How to integrate Brevo with Webflow

Integrate Brevo with Webflow to automate email marketing workflows, sync contact data, and track campaign engagement without manual exports. Connect your Webflow forms to Brevo contact lists, trigger automated email sequences from content updates, and monitor subscriber activity directly in your Webflow CMS.

You can integrate Brevo with Webflow using embed forms, native Webflow forms that post directly to Brevo endpoints, or custom API integrations for advanced automation workflows.

Embed Brevo's signup form using Webflow’s Embed element

Brevo generates form code through its visual form builder that you can paste directly into Webflow. Create signup forms in Brevo's dashboard, customize fields and styling, then add the embed code to your Webflow pages without additional configuration.

Navigate to Contacts > Forms in your Brevo dashboard and use the drag-and-drop form builder to configure fields. Select the "Full page/embedded card" option to generate embed code. Brevo provides three formats with different styling behaviors.

• Iframe embed for complete form isolation from your site styles
• HTML embed for forms that inherit some site styling
• Simple HTML for maximum customization control

Copy your chosen embed code and add an Embed element to your Webflow page. Paste the Brevo code and publish. Form submissions flow directly to Brevo.

This approach works best when you want Brevo's validation, styling options, and automatic double opt-in handling. The tradeoff is less design control compared to native Webflow forms.

Connect native Webflow forms to Brevo

Existing Webflow forms can send submissions directly to Brevo endpoints by configuring form attributes. This method keeps your Webflow design system while connecting to Brevo's contact database.

Set your form's Method attribute to POST in Webflow. Configure the Form Action to your unique Brevo URL with this pattern https://[your-unique-id].sibforms.com/serve/[long-string]. Find your specific URL in Brevo under Contacts > Forms when viewing embed code.

Name your email input field exactly EMAIL (case-sensitive). Brevo requires this specific field name to process submissions. Add these hidden fields to your form.

• email_address_check with empty value (spam prevention)
• locale set to your language code (e.g., "en")
• html_type set to "simple" (form processing type)

Additional form fields map to Brevo contact attributes by matching field names. Custom attributes in Brevo must be created before form submission. The Brevo form creation guide documents all required and optional field configurations.

Connect through Zapier or Make

Automation platforms handle Webflow-Brevo integration through pre-built templates without requiring custom code or webhook configuration. These tools run workflows that trigger when Webflow forms receive submissions or CMS items change.

Zapier and Make both offer Webflow-Brevo integrations. Create an account on either platform, authenticate both your Webflow and Brevo accounts, then configure trigger and action steps.

Common workflows include:

• Syncing form submissions to Brevo contacts
• Adding subscribers to specific lists based on form fields
• Updating contact attributes when CMS items change
• Triggering Brevo email campaigns from Webflow events

These platforms work well when you need integration without maintaining server infrastructure or writing code. They handle API authentication, rate limiting, and error handling automatically. The tradeoff is less flexibility for complex logic compared to custom API implementations.

Build with Webflow and Brevo APIs

API integration gives you programmatic control over contact management, campaign triggers, and bidirectional data synchronization. Use this method when you need custom workflows beyond standard form submissions.

The Brevo API documentation provides REST endpoints for all platform features. Webflow's Data API exposes CMS collections and form submissions for reading and writing data.

Sync Webflow form submissions to Brevo contacts

Capture form submissions from Webflow and create or update Brevo contacts programmatically. Set up a webhook receiver that listens for Webflow form events, then calls Brevo's contact creation endpoint.

Map form fields to Brevo contact attributes. Standard attributes like email, firstname, and lastname work automatically. Custom attributes require setup in Brevo before API calls.

This pattern works for membership sites that capture detailed user profiles, multi-step forms that collect data across pages, or conditional list assignment based on form responses.

Track email engagement in Webflow CMS

Brevo sends webhook events when contacts open emails, click links, or unsubscribe. Receive these events and update Webflow CMS items to track engagement metrics alongside your content.

Configure Brevo transactional webhooks to send events to your endpoint. Brevo supports 15+ event types including delivered, opened, clicked, hard_bounced, and unsubscribed. Marketing campaign webhooks provide similar events for bulk email sends.

Process webhook payloads and extract contact_id, event type, and timestamp. Use the Webflow Data API to update corresponding CMS items with engagement data.

Example webhook payload structure from Brevo:

{
  "event": "delivered",
  "email": "user@example.com",
  "id": 12345,
  "date": "2023-01-15 10:30:00",
  "ts": 1673778600,
  "message-id": "<message-uuid@domain.com>",
  "subject": "Welcome Email",
  "contact_id": 67890,
  "template_id": 123,
  "tags": ["onboarding", "welcome"],
  "sending_ip": "192.168.1.1"
}

This enables engagement scoring for gated content sites, user activity dashboards that combine CMS and email metrics, or automated follow-up workflows triggered by email behavior.

Trigger Brevo campaigns from Webflow events

Start automated email sequences when Webflow CMS items change or specific user actions occur. Listen for Webflow webhook events and call Brevo's transactional email or automation endpoints.

Webflow sends CMS lifecycle events including collection_item_created, collection_item_changed, and collection_item_published. Configure webhooks for relevant collections and process events on your server.

When events match your criteria, call Brevo's transactional email API to send immediate emails or add contacts to automation workflows. Pass contact attributes and template variables to personalize messages.

Use this pattern for content publication notifications that email subscribers when new blog posts publish, onboarding sequences that start when user profiles are created, or abandoned cart reminders triggered by CMS item status changes.

What you can build

Integrating Brevo with Webflow lets you build automated email marketing systems that respond to site activity and maintain synchronized contact data.

• Newsletter signup forms: Add email capture forms to blog posts and landing pages that sync subscribers to Brevo lists and trigger welcome email sequences
• Content upgrade delivery systems: Gate premium content behind email forms that add contacts to Brevo, send download links via transactional email, and track engagement metrics back to Webflow CMS
• Event registration with automated reminders: Build event landing pages with registration forms that create Brevo contacts, trigger confirmation emails, and send automated reminders as event dates approach
• Lead scoring dashboards: Track email opens and clicks from Brevo webhooks, write engagement data to Webflow CMS, and display user activity scores in member portals or admin dashboards