Pipedrive

A Webflow form stores a visitor's details in Webflow and sends an email notification. Nothing routes that inquiry to a sales rep or tracks it through follow-up toward a closed deal. Every submission that should become a record in Pipedrive waits for someone to copy it over by hand.

Connecting Pipedrive with Webflow removes that manual step. Depending on the integration method and plan, form submissions can be created as Pipedrive records immediately or via a polling schedule. Data can also flow the other way, so deal changes in Pipedrive update content in the Webflow CMS.

The integration fits marketing teams that capture inbound leads and sales ops teams that route those leads to the right rep. Founders use it to feed the pipeline from the website without a developer. Webflow agencies use the same patterns on client sites. Metawork Studio, a certified Pipedrive partner, builds this kind of Webflow-to-Pipedrive lead capture for its clients.

How to integrate Pipedrive with Webflow

What is Pipedrive? Pipedrive is a sales CRM built around activity-based selling. Its data model centers on deals moving through pipeline stages and people as individual contacts. Organizations are the companies those contacts work for. Every plan includes a free API token. The LeadBooster add-on supplies embeddable Web Forms, a Chatbot, and Live Chat. 

Getting that pipeline fed from a Webflow site requires some setup, and the right method depends on how much control you need.

Neither the Webflow nor Pipedrive Marketplace lists a native app for this integration, so every connection here is a third-party or custom setup. Connect the two MCP servers if you want an AI assistant working across both products. Use an embed or Zapier for basic lead capture, and the APIs when you need deduplication logic or two-way sync.

Choose the integration method based on the control and development resources your setup requires:

• MCP servers let an AI assistant read Pipedrive records and edit Webflow content inside one conversation, with no code to write.
• Pipedrive embeds add Web Forms, the Chatbot, and Web Visitors tracking through Code Embed elements or site-wide custom code.
• Automation platforms such as Zapier, Make, n8n, and viaSocket connect native Webflow forms and ecommerce orders to Pipedrive records.
• The Webflow and Pipedrive APIs give you full control over field mapping and two-way sync, but require server-side development.

These methods can be combined depending on the complexity of the setup.

Connect Pipedrive and Webflow through MCP servers

Both products publish a hosted MCP server, so an AI assistant can read the sales pipeline and change site content in a single session. Nothing gets installed on the Webflow site itself, which makes this the quickest of the four methods to try.

Pipedrive's MCP server connects over OAuth and is available to customers on every plan, with usage metered against the token allowance that comes with your tier. Once it is connected, an assistant can search deals, contacts, organizations, and leads, pull pipeline detail, and create or update deals, contacts, and activities. Pipedrive documents the connector setup and the tool list it exposes.

On our side, the Webflow MCP server covers design and build work, site management across the CMS, pages, forms, and SEO, plus analytics and governance controls. We document installs for Claude Code, Claude Desktop, Cursor, Windsurf, and Postman, and each authorization grants access to a single workspace.

Be clear about what this method is not. MCP is assistant-driven, so nothing fires on its own when a form comes in overnight. For unattended routing, keep reading.

Embed Pipedrive components with Code Embed elements

Web Forms and the Chatbot are embeddable Pipedrive components that run directly on a Webflow site. Both require the LeadBooster add-on. It is included on Premium and higher plans, and available as an add-on for Lite and Growth. The Web Visitors tracker also runs directly on a Webflow site as a separate add-on, not part of LeadBooster. Pasted code goes live only after you publish the site.

Embed Pipedrive Web Forms

Pipedrive Web Forms collect visitor information and funnel it into Pipedrive as deals or leads. No third-party tools sit in between. You need deals admin permission in Pipedrive. Because submissions travel straight to the CRM, this is the fastest path for teams already paying for LeadBooster.

To embed a Web Form:

1. In Pipedrive, go to Leads > Web Forms and click New Web Form.
2. Select a template, click Create form, and build the form using blocks. The submit button block is mandatory and must come last.
3. Configure submit options for data saving, the thank-you message, or a redirect.
4. Under Share and embed, choose the embed option and click Copy to clipboard.
5. In Webflow, add a Code Embed element where the form should appear and paste the snippet.
6. Publish the site to make the form live.

New deals created through the form trigger Pipedrive email notifications and automations. Watch for two limits. Images only appear when the form is shared as a standalone link, not when embedded. Paste the copied embed code as-is rather than rebuilding it by hand.

The Pipedrive Chatbot offers four playbook types: get more leads, book more meetings, qualify and route leads, and chat with your leads. Add Live Chat as a card to an existing Chatbot playbook. It stays in offline mode until you embed the playbook on a page. Creating a playbook needs deals admin permission.

To add the Chatbot to a Webflow site:

1. In Pipedrive, go to the Chatbot tab and open your playbook.
2. Click … on the right side of the playbook and select the webpage-embedding installation code.
3. In Webflow, paste the snippet into Site settings > Custom code > Head code, then publish.

Each page can only run one Chatbot playbook, so plan playbook assignments before embedding across a multi-page site.

Install the Web Visitors tracker

The Web Visitors tracker script reports site visitor data into Pipedrive under Leads > Web Visitors. Pipedrive's install guide places the script in the page head, so add it as site-wide head code.

To install the tracker:

1. In Pipedrive, go to Leads > Web Visitors and click Set up Web Visitors. On existing accounts, click … > View tracker script.
2. Copy the tracker script.
3. In Webflow, paste it into Site settings > Custom code > Head code, then publish.

Google Tag Manager is an alternative install path using a Custom HTML tag with an All Pages trigger. The tracker status shows "Installed" only after the site receives visits. You can run the script on multiple sites and distinguish them with a Hostname filter.

Connect with Zapier, Make, n8n, or viaSocket

Automation platforms let you keep native Webflow forms, with their design control and stored submissions. Every entry still lands in Pipedrive. Zapier, Make, n8n, and viaSocket all list direct Webflow-to-Pipedrive integrations. Zapier has one prerequisite. The Webflow form must have received at least one submission before you can connect it to a Zap.

The main trigger-to-action pairs:

• A new Webflow form submission creates a Pipedrive lead, deal, person, organization, or activity (Zapier, n8n, viaSocket).
• A new or updated Webflow ecommerce order creates or updates a Pipedrive deal (Zapier).
• A new Pipedrive deal updates Webflow CMS items in the reverse direction (Zapier).
• viaSocket adds Webflow triggers for site publishes, collection item changes, and inventory changes. Its instant triggers sync in real time.

Zapier offers pre-built templates for turning form submissions into leads and for creating deals from those same submissions. Make lists 131 modules for the pair. In Make, a Webflow Watch Events trigger can create or update a Pipedrive deal, lead, person, or organization. Its CMS operations don't auto-publish, so chain the Publish an Item and Publish a Site modules. n8n publishes a ready workflow that syncs leads from Webflow into Pipedrive. When no matching contact exists, it creates a person, adds a note, and creates a lead. In Zapier, polling triggers run on a schedule while instant triggers deliver as events happen.

Build with the Webflow and Pipedrive APIs

A custom build lets you define every field mapping and apply custom deduplication during two-way sync. Webflow sites don't execute backend logic. Use a serverless function such as AWS Lambda or Netlify Functions, or a Webflow Cloud app, to relay the data.

• The Pipedrive API handles persons, organizations, deals, leads, and activities, authenticated by API token or OAuth 2.0.
• Webflow's Data API handles CMS collections and form submissions under https://api.webflow.com/v2.
• Webflow webhooks trigger real-time events between systems.

Webflow's Data API v1 was deprecated on March 31, 2025. Pipedrive's v1 endpoints entered out-of-support status on August 1, 2026. Leads CRUD remains v1-only in the current reference.

Create Pipedrive records from Webflow form submissions

This pattern replaces middleware with your own endpoint. A Webflow webhook fires on each form submission. Your function writes the data to Pipedrive, using a search-before-create flow to avoid duplicates.

To implement it:

1. Register a webhook with POST https://api.webflow.com/v2/sites/{site_id}/webhooks and the body {"triggerType": "form_submission", "url": "https://your-function-url"}. Registering the webhook requires the sites:write scope. Reading the submitted form data uses the forms:read scope.
2. In your function, validate the x-webflow-signature header using HMAC-SHA256 over the x-webflow-timestamp value and the raw request body joined by a colon. Reject requests whose timestamp is older than five minutes.
3. Search for an existing contact with GET /api/v2/persons/search; if none matches, create one with POST /api/v2/persons.
4. Create the sales record with POST /api/v2/deals for a deal or POST /api/v1/leads for a lead.

A Pipedrive lead "always has to be linked to a person or an organization or both." Create the person before the lead call.

Sync Pipedrive deal changes to the Webflow CMS

Pipedrive webhooks push real-time notifications when CRM data changes. Deal updates can then drive site content such as case studies or customer logos. Webhooks v2 became the default version on March 17, 2025. Each payload arrives with meta, data, and previous blocks.

To implement it:

1. Subscribe to deal changes with POST /api/v1/webhooks. Set subscription_url to your endpoint, event_action to change, event_object to deal, version to "2.0", and name to Webflow CMS deal sync.
2. Match the incoming payload to a CMS item using a stored Pipedrive deal ID.
3. Update up to 100 items per request with PATCH https://api.webflow.com/v2/collections/{collection_id}/items for staged changes, or the /items/live variant to publish immediately.
4. Push staged changes live with POST https://api.webflow.com/v2/collections/{collection_id}/items/publish.

On change events, the previous block carries only the changed fields, which keeps diffing simple. Build your endpoint to respond quickly with a 2XX status. A Pipedrive webhook is deleted after three consecutive days without a successful delivery.

What you can build with the Pipedrive Webflow integration

Integrating Pipedrive with Webflow lets you route website visitors into a managed sales pipeline without manual data entry.

• Lead capture with automated qualification: Swiss coworking brand ORBIZ, in a build by Metawork Studio, runs Webflow forms that feed contacts and inquiries into Pipedrive with automated lead qualification.
• Pricing calculators that create qualified leads: A Webflow pricing calculator can capture project details and map them to Pipedrive fields, creating a lead the moment a visitor finishes an estimate. Follow-up automation fires when no booking follows.
• Chatbot qualification on landing pages: A Pipedrive Chatbot playbook embedded in Webflow uses the qualify-and-route playbook type. It sorts visitors before they reach the pipeline.
• Pipeline-driven site content: Pipedrive deal webhooks update Webflow CMS collections automatically, so case studies, testimonials, and customer logos stay current as deals close.

If you need custom field mapping and deduplication during two-way sync, the API path covers those cases. Start with our guide to the Webflow CMS API if that reverse sync is where you are headed, and connect the Webflow MCP server first if you would rather hand the whole loop to an assistant.