Bitrix24

Connect Bitrix24's CRM and business tools with your Webflow site using multiple integration methods, including embedded CRM forms, live chat widgets, and API-driven integrations.

Install app
View website
View lesson
A record settings
CNAME record settings
Bitrix24

How to integrate Bitrix24 with Webflow

Connecting Bitrix24 to Webflow captures leads directly into your CRM, displays deal data on your site, and syncs customer information between platforms. Teams that integrate their CRM with their website reduce manual data entry and respond faster to prospects.

Integrate Bitrix24 with Webflow through embed codes for forms and widgets, or use APIs for custom data synchronization. Embed codes add CRM forms and live chat to your site in minutes through simple copy-paste integration. API integration syncs data between Bitrix24 CRM and Webflow CMS collections, though it requires custom development.

Embed CRM forms and widgets

Bitrix24 generates JavaScript embed codes for CRM forms and website widgets that work in Webflow's Code Embed element. Create forms in Bitrix24, copy the embed code, and paste it into Webflow. No API credentials or custom development required.

Available embed options:

  • CRM forms in block mode: Display the form as a permanent visible section on your page for direct lead capture
  • CRM forms with on-click popup: Trigger the form in a modal window when visitors click a button or link
  • CRM forms with delayed popup: Show the form automatically after a specified time delay to capture exit intent
  • Live chat widget: Add real-time customer communication that connects to your Bitrix24 inbox
  • Callback request forms: Let visitors schedule calls directly into your team calendar
  • Booking and appointment widgets: Enable direct scheduling for services or consultations

Create and configure forms in Bitrix24's CRM section before generating embed codes. Each form type produces its own JavaScript snippet. For site-wide widgets like chat, add the code to Webflow's footer code section in Site settings > Custom code. For page-specific forms, drag a Code Embed element onto the canvas and paste the code.

Webflow's Code Embed element supports up to 10,000 characters per element. If Bitrix24 widget codes exceed this limit, host the code externally and reference it via <script src=""> tags. Forms capture data directly into Bitrix24 CRM without middleware or database configuration.

Build with Webflow and Bitrix24 APIs

Direct API integration supports custom workflows that embed codes cannot handle. Use the Bitrix24 REST API and Webflow CMS API to sync data between platforms, display CRM records on Webflow pages, or push CMS content into Bitrix24.

API integration requires server-side code to manage authentication and data transformation. Bitrix24 uses webhook-based authentication where you generate a webhook code in the admin panel and include it in the API endpoint path. Webflow's CMS API requires OAuth 2.0 Bearer tokens with appropriate scopes such as cms:read for read operations and cms:write for write operations.

Sync Bitrix24 contacts to Webflow CMS

Display CRM contacts on your Webflow site by fetching data from Bitrix24 and creating CMS items. This pattern works for member directories, customer showcases, or team listings that pull contact data from your CRM through API integration.

Fetch contacts from Bitrix24 using crm.contact.list, which returns up to 50 records per request with pagination support. Map Bitrix24 fields to your Webflow collection schema using GET /collections/{collectionid} to retrieve field definitions. Create items with POST /collections/{collectionid}/items and manage their published state using Webflow's CMS API publishing endpoints.

Send Webflow form data to Bitrix24 CRM

Capture leads on Webflow using Bitrix24's embed methods such as CRM forms (available in block mode, on-click popup, or delayed popup formats) or the website widget system. For custom implementations, send form submissions to the crm.contact.add endpoint, which creates new contacts in Bitrix24 CRM. This API approach gives you complete control over field mapping, validation, and error handling.

Build a serverless function that receives Webflow form webhooks, transforms the data into Bitrix24's expected format, and calls the contact creation endpoint. Include fields like NAME, LAST_NAME, PHONE, and EMAIL in the request body. The API returns the new contact ID for tracking.

For deal creation instead of contacts, use crm.deal.add with fields like TITLE, TYPEID, CATEGORYID, STAGEID, OPPORTUNITY, and ASSIGNEDBY_ID. This pattern works for e-commerce integrations where Webflow captures orders and Bitrix24 manages the sales pipeline.

Display Bitrix24 deals on Webflow pages

Display live deal data from your CRM on Webflow pages by fetching records through the crm.deal.list endpoint with webhook authentication and rendering them through custom JavaScript. Bitrix24's REST API supports both GET and POST methods for list endpoints. This enables dashboards, progress trackers, or client portals that reflect real-time CRM status.

Retrieve deal details using crm.deal.get for individual records. Transform the API response into HTML and inject it into your Webflow page through custom code. For authenticated portals, filter deals by deal ID or custom fields to show user-specific data.

Keep CRM and CMS synchronized

When contacts update in Bitrix24, refresh Webflow CMS items using the Webflow CMS API to create or update collection items with the latest data. When CMS entries change, update CRM records using the crm.contact.update endpoint. This requires mapping fields between systems and implementing custom sync logic.

This pattern requires careful architecture to prevent sync loops and data conflicts. Use unique identifiers to match records across platforms. Log all sync operations for debugging and audit trails.

What you can build

Integrating Bitrix24 with Webflow builds CRM-connected websites that capture leads, display customer data, and automate sales workflows.

  • Lead capture landing pages: Build conversion-focused pages with embedded Bitrix24 CRM forms that send prospect information directly to your Bitrix24 CRM and trigger automatic follow-up sequences based on your configured form settings
  • Client portal websites: Display deal information, project updates, and communication options through embedded Bitrix24 forms and widgets in Webflow pages, or sync contact and deal data into Webflow collections through API integration for custom displays
  • Service booking sites: Embed Bitrix24's appointment widget on service pages to let customers schedule consultations, demos, or support calls that appear directly in your team's calendar
  • Team directory pages: Sync employee contacts from Bitrix24 CRM to Webflow collections to create and maintain team listings with photos, contact details, and department information through the Bitrix24 CRM contact APIs paired with Webflow's CMS collection APIs

Frequently asked questions

  • Create your form in Bitrix24 by navigating to CRM > Forms > Create new form. Configure the fields and appearance, then locate the embed code in the form settings. The form embedding guide shows three display modes: block (permanent), on-click popup, and delayed popup. Each generates distinct JavaScript code.

    In Webflow, drag a Code Embed element from the Add panel onto your page. Paste the Bitrix24 code into the embed editor. The custom code embed documentation explains how to add HTML, CSS, and JavaScript. Publish your site to make the form functional.

  • Yes. Generate the widget code from CRM > Add-ons > Website Widget in your Bitrix24 dashboard. The website widget guide shows how to configure chat, callback, and booking options in a single widget.

    For site-wide implementation, go to Webflow Site settings > Custom code > Footer code and paste the widget script. The custom code in head and body tags guide explains that footer code loads before the closing </body> tag on every page. This makes the chat widget appear throughout your site.

  • Bitrix24 uses webhook-based authentication instead of OAuth. Generate a webhook in your Bitrix24 admin panel under Applications > Webhooks. The webhook documentation explains that webhooks produce a URL structure: /rest/{user_id}/{webhook_code}/{method}.

    The webhook code acts as your authorization credential. Include it in every API request URL. This webhook-based authentication is simpler than OAuth flows but means webhook codes must be kept secure since they provide direct access to your CRM data.

  • Webflow requires OAuth 2.0 Bearer tokens with specific scopes for API authentication. The CMS API reference documents that reading collections requires the cms:read scope. Creating and updating items requires additional write scopes as specified in the API documentation.

    Request tokens through Webflow's OAuth flow with appropriate scopes for your integration needs. Include the token in API requests via the Authorization: Bearer <token> header. The collections list endpoint and collections get endpoint show how to discover collection schemas before syncing data.

  • Use crm.contact.list to fetch contacts from Bitrix24. The endpoint returns up to 50 records per request and supports filtering, sorting, and pagination through the start parameter. Extract fields like NAME, LAST_NAME, EMAIL, and PHONE from the response.

    Map these fields to your Webflow collection schema, then create items using the POST /collections/{collectionid}/items endpoint. Items are created in staged state (not immediately live). Publish them using POST /collections/{collectionid}/items/publish to make them visible on your live site. Both endpoints require OAuth 2.0 Bearer token authentication. Build this workflow in a server-side script that runs on schedule or triggered by Bitrix24 webhook events or API calls.

Bitrix24
Bitrix24
Joined in

Category

CRM

Description

Bitrix24 is a CRM and business collaboration platform that handles contact management, deal tracking, lead capture forms, live chat widgets, and team collaboration tools.

Install app

This integration page is provided for informational and convenience purposes only.


Other CRM integrations

Other CRM integrations

Attio

Attio

Connect Webflow form submissions and content updates to Attio's CRM through automation platforms or direct API integration.

CRM
Learn more
Pipedrive

Pipedrive

Connect Pipedrive's powerful sales CRM with Webflow to automatically capture leads, sync customer data, and create dynamic content from your sales pipeline. Transform website visitors into organized deals while keeping your CMS updated with real-time customer information.

CRM
Learn more
HubSpot

HubSpot

Connect HubSpot's powerful CRM and marketing automation platform with Webflow to create personalized web experiences, automate lead capture, and unify your marketing data. Streamline workflows while maintaining complete design control over your website.

CRM
Learn more
Hubspot via Vimkit

Hubspot via Vimkit

Connect Vimkit with Webflow to sync form submissions directly to the HubSpot CRM without custom code.

CRM
Learn more

Related integrations

No items found.

Get started for free

Try Webflow for as long as you like with our free Starter plan. Purchase a paid Site plan to publish, host, and unlock additional features.

Get started — it’s free