Odoo

How to integrate Odoo with Webflow

Webflow's visual design system and Odoo's ERP modules don't connect natively, but developers can build workflows that sync form submissions to CRM leads, update product catalogs between systems, and process e-commerce orders through fulfillment pipelines.

Connect Webflow and Odoo through three methods based on technical requirements and development resources. Third-party automation platforms like Zapier provide pre-built workflows that require no coding and work well for lead capture and simple data sync. Code embeds let you add Odoo widgets like Live Chat and forms directly to Webflow pages using HTML snippets. API integration gives you complete control over data flow and timing but requires development work to handle authentication, JSON-RPC protocol formatting, and rate limits.

Use third-party automation platforms

Zapier offers the most accessible solution for non-technical users with a pre-built workflow that creates Odoo CRM leads from Webflow form submissions. The platform handles API authentication and data transformation through a visual interface without requiring custom code. The free tier uses 15-minute polling intervals rather than real-time webhook triggers.

Make.com provides more advanced workflow capabilities with custom data mapping and real-time webhook support, making it suitable for complex synchronization scenarios that require conditional logic and multi-step workflows. The platform is more cost-effective at scale compared to Zapier.

n8n offers a self-hosted alternative with unlimited workflow executions and no restrictive rate limits on paid plans. This option provides better data privacy control for organizations that require on-premises deployment.

Albato and viaSocket provide alternative platforms with visual integration builders and varying synchronization modes including real-time, scheduled, and migration options. These platforms are less widely adopted for Odoo-Webflow connections compared to Zapier or Make.

Zapier's Odoo-Webflow integration offers pre-built templates for common workflows. Make (Integromat) and n8n provide both Webflow and Odoo integrations separately, allowing custom workflow construction with more advanced routing and conditional logic than Zapier's standard templates.

The most established workflow powered by Zapier automatically creates CRM leads when Webflow forms are submitted. You connect both accounts through Zapier, select form submission as the trigger, choose "Create Lead" as the Odoo action, and map form fields to CRM fields through the visual interface. Zapier handles authentication and API calls between the two platforms in the background.

Some common automation patterns using Odoo and Webflow include:

• Lead capture creates Odoo CRM leads from Webflow form submissions
• Contact sync maps Webflow form data to Odoo CRM leads with contact details including email and phone
• Order processing requires custom implementation or the Odoo Webflow Connector module to sync Webflow e-commerce orders to Odoo Sales
• CMS updates for bidirectional synchronization with Webflow CMS collections require custom API integration or automation platforms like Zapier

Make.com offers better webhook support than Zapier and has more cost-effective pricing at scale. n8n provides unlimited executions on self-hosted deployments, which works well for high-volume operations or strict data privacy requirements.

Rate limits apply on both sides. Webflow restricts API calls to 60-120 requests per minute depending on your plan, documented in the rate limits reference. Odoo SaaS instances typically limit requests to approximately 60 per minute based on empirical observations in production environments. Complex workflows with multiple steps consume more operations and may hit platform limits during high-traffic periods.

Embed Odoo widgets and forms

Odoo provides embeddable JavaScript and iframe code for adding Live Chat and forms directly to Webflow pages. These work well for customer support and lead capture without requiring middleware. The Odoo Live Chat documentation includes ready-to-use embed code that you copy from your Live Chat channel's Widget tab.

Add the Live Chat script to your Webflow site through Site Settings → Custom Code → Head Code for site-wide chat functionality. The script loads Odoo's chat interface with your configured button color, welcome messages, and routing rules. You customize appearance and behavior in Odoo's Live Chat settings without editing JavaScript.

Embed implementation options:

• Live Chat widget copies the JavaScript snippet from Odoo Live Chat and adds it to Webflow custom code in the head or body tags in Site Settings or individual pages
• Contact forms create forms in Odoo's Website Builder and embed them through iframe using Webflow's Code Embed element which supports up to 50,000 characters per embed
• Appointment booking embeds Odoo Appointments using iframe, configured with proxy_mode = True in odoo.conf or nginx headers for CORS access

Odoo doesn't provide embeddable product catalogs, shopping carts, or checkout widgets for external websites. The Odoo Building Blocks documentation confirms that e-commerce features are designed for Odoo's integrated website builder and don't generate standalone embed codes.

For forms, set your Odoo page template to "synchronous" or "async" mode to avoid loading the full page header and footer inside the iframe. This creates a clean embed with just the form fields and submission button.

Build with Webflow and Odoo APIs

API integration gives you complete control over data flow, timing, and business logic. The Webflow Data API uses RESTful patterns with JSON payloads. The Odoo External API supports both JSON-RPC and XML-RPC protocols. You build middleware that receives Webflow webhooks or polls the API, transforms data to match Odoo's structure, and posts to the appropriate endpoints.

Both platforms require bearer token authentication. Generate API keys in Odoo through Profile Preferences → Account Security → New API Key as documented in the official Odoo API key generation process. Create Webflow tokens in Site Settings → Apps & Integrations → API Access per the official Webflow authentication documentation. Store credentials server-side and never expose them in client-side code.

Capture leads from Webflow forms

Lead capture requires receiving Webflow form submissions and posting them to Odoo's CRM. Configure a form submission webhook to send data to your server when forms are submitted. Your middleware receives the POST request with form field data, maps it to Odoo's expected format, and creates a lead record using the crm.lead model's create method through Odoo's JSON-RPC API endpoint. Webhook handlers must respond within 5 seconds to avoid timeout failures.

Webflow to Odoo field mapping:

• Form name field → Odoo name parameter in crm.lead model
• Form email field → Odoo email_from parameter
• Form phone field → Odoo phone parameter
• Form message field → Odoo description parameter

Create leads by posting to the Odoo External API using JSON-RPC format. The Odoo External API reference documents requests that use the standard JSON-RPC 2.0 structure with the crm.lead model and create method. The request body maps your form fields to Odoo lead parameters including name, email_from, phone, and description. Successful creation returns the new lead's ID as the result, which you can store to track the relationship between Webflow submissions and Odoo records.

Never call Odoo's API directly from Webflow's client-side code. Instead, implement a server-side webhook receiver or backend service that handles these security requirements:

• Validates the incoming request signature and HTTPS protocol
• Sanitizes and validates all form data before sending to Odoo
• Handles rate limiting with exponential backoff for Webflow's 60-120 requests per minute depending on plan and Odoo's typical limit of approximately 60 requests per minute
• Uses API key authentication for Odoo 14+ rather than username and password for enhanced security
• Logs all errors and API responses for debugging
• Returns appropriate HTTP status codes including 200 for success, 400 for validation errors, and 429 for rate limits
• Securely stores API credentials as environment variables, never in code
• Implements retry logic with appropriate delays for handling throttled requests

The Webflow security practices guide emphasizes keeping API credentials server-side and validating all data before external API calls.

Sync products between systems

Product synchronization requires bidirectional data flow. Pull product data from Odoo using the JSON-RPC API with the search_read method on the product.product model documented in the Odoo 19.0 External API reference, transform it to match your Webflow CMS collection schema, and post to the Webflow Collections API. Note that Webflow maintains separate endpoints for staged (draft) and live content. Items must be created in staged state first before publishing.

Track synchronization state with custom fields in both systems including a webflow_synced Boolean and webflow_item_id Char field in Odoo to avoid duplicate records and detect conflicts. For real-time updates, implement Odoo Automated Actions that trigger on record changes while respecting Webflow's rate limits of 60-120 requests per minute depending on your plan tier.

Odoo to Webflow product sync uses the search_read method to retrieve product records with fields including name, list_price, default_code, and description_sale. This endpoint returns structured product data that can be transformed to match your Webflow collection structure. Post the transformed data to create CMS items. Store Odoo's product ID in a Webflow custom field such as odoo-id to maintain the relationship between the two systems for future synchronization and updates.

When inventory changes in Webflow, update Odoo stock levels using the stock.quant model or product variant quantity fields. The Odoo Inventory documentation describes how stock management integrates with sales, warehouses, and fulfillment. To trigger updates when quantities are modified, implement scheduled synchronization using Odoo's API with polling intervals, or configure Webflow CMS webhooks to post inventory changes to a custom receiver endpoint that processes the data and updates Odoo stock levels through the JSON-RPC API.

Neither platform provides native conflict resolution. Implement a master-slave pattern where one system is authoritative, or use timestamp comparison to determine which record is newer. The write_date field in Odoo tracks last modification time. For Webflow, track last modification timestamps in a custom field since Webflow does not expose a standard updated-on field through the API. Store sync timestamps to detect when both records changed since last synchronization.

Process orders and fulfillment

Order synchronization connects Webflow e-commerce transactions to Odoo's sales and inventory management. When orders are placed in Webflow, the ecomm_new_order webhook event triggers, along with ecomm_order_changed events when order statuses update. These webhook events can be configured to automatically create corresponding sales orders in Odoo for fulfillment tracking. The Webflow e-commerce webhooks documentation details these real-time events, while Odoo Sales documentation describes the sale.order model structure and related sale.order.line for order line items. Order creation in Odoo requires prerequisite API calls to resolve customer records through res.partner and map Webflow products to Odoo product.product IDs before writing the order data.

Order creation workflow steps:

1. Receive ecomm_new_order webhook from Webflow
2. Look up or create customer in Odoo using the External API
3. Map product IDs between Webflow SKUs and Odoo products
4. Create sale order using the sale.order model with proper JSON-RPC 2.0 request format
5. Update order status in both systems as fulfillment progresses using write operations on sale.order records

The GetKnit integration guide provides detailed field mapping examples for e-commerce order synchronization including customer information, product details, quantities, prices, and shipping data.

What you can build

Integrating Odoo with Webflow enables automated business workflows that connect your website to backend operations.

• Lead generation system: Build a marketing website in Webflow with custom forms that automatically create leads in Odoo CRM with proper field mapping for contact information, message content, and lead source tracking
• E-commerce storefront with ERP backend: Create a product catalog in Webflow that syncs inventory, pricing, and product variants with Odoo's multi-warehouse system through the Odoo Webflow Connector module ($404.10) combined with custom implementation work
• Customer portal with live support: Design a member dashboard in Webflow that embeds Odoo's Live Chat widget for real-time support, requiring separate integration work to sync customer data between Webflow forms and Odoo CRM, then display unified information through custom API calls
• Manufacturing order system: Build a custom product configurator in Webflow that creates sales orders in Odoo through form submissions and API integration, routing detailed product specifications to Odoo's sales order system where approval workflows and inventory allocation processes apply