Bitrix24 Online Chat Widget: Custom Setup & Integration
A poorly configured online chat widget can cause 60-80% of inquiries to be lost. The standard button with the Bitrix24 logo is often ignored: click-through rates rarely exceed 1-2%. Meanwhile, a properly customized widget can increase leads by 30-50% through timely appearance and personalization. We are Bitrix24 developers with 5 years of experience and over 300 completed projects—from simple chats to multi-channel contact centers integrated with 1C and CRM. We guarantee a setup that matches your design and business processes. In this article, we will cover key widget settings: visual customization, automatic display rules, and more.
Visual Customization: Color, Position, Trigger
Setup starts at: Bitrix24 → CRM → Contact Center → Online Chat → desired chat → 'Settings'.
Color and theme. The main color should match your brand's accent color. Light and dark themes are available. Important: use no more than two accent colors to avoid visual overload.
Position. Default is bottom-right corner. You can move it to the bottom-left and adjust offsets in pixels. For mobile devices, keep the right side to avoid covering content.
Trigger button. The standard round button or a custom HTML trigger via JavaScript API:
BX24.openMessenger(); // opens chat on click Greeting message. Text the visitor sees when opening the chat before an operator responds. Personalize it: include the operator's name, avatar, and a phrase like 'How can I help?' This builds trust from the first seconds.
Operator name and avatar. You can show a real employee from the list or create a virtual one—e.g., 'Support' with a company logo. For large teams, we recommend using real photos—this increases loyalty by 20-30%.
How to Set Up a Pre-Chat Form?
The form for collecting visitor data is configured in the 'Form' section within chat settings. Available fields: name, phone, email, question text. Each field can be mandatory or optional. Data is automatically passed to CRM leads.
Enable the form when no operators are online—it collects contacts for callbacks. For consulting businesses that need to know the client's name upfront, the form is required. For high-conversion e-commerce sites, it's better to disable the form—any extra field adds friction. A/B testing shows that without a form, first messages increase by 30-50%.
Display Rules: When and to Whom to Show the Widget?
The widget doesn't have to appear identically on all pages. In chat settings → 'Rules' section:
- Delay: button appears N seconds after page load (typically 3-5 seconds).
- URL conditions: show only on /catalog/* or hide on /admin/*.
- Mobile devices: disable widget on phones if it interferes with navigation.
- Scroll behavior: show when the user scrolls 50% of the page—effective for long articles.
All rules are set through the interface—no code required. A proper combination of rules can increase conversion by up to 40%.
Widget Operating Modes
| Mode | Condition | Action |
|---|---|---|
| Online | Operators available | Real-time chat |
| Offline | No operators available | 'Leave a message' form → lead created |
| Hybrid | Partial availability | Automatic switching by schedule |
Automatic switching depends on operator status and the working schedule of the open line.
How to Set Up the Widget: Step-by-Step
- Audit current state: ensure the chat script is loaded once (no duplicates) and doesn't conflict with other scripts.
- Customize appearance: set color, position, upload operator avatar, configure greeting message.
- Configure pre-chat form: choose fields, decide if they are mandatory, and when to show the form (always or only offline).
- Set display rules: define delay, URL conditions, mobile behavior.
- Integrate with CRM: verify that chat inquiries are correctly saved as leads or deals.
- Test: check functionality on different pages, devices, and with various operator statuses.
Typical Errors and Solutions
- Widget flashes or appears twice: duplicate embed code. Ensure the script is included once.
- Color doesn't change: browser cache or external CSS overrides. Use !important or check CSS order.
- Offline mode not working: operator work schedule not set. Configure the open line schedule.
- Bitrix24 logo not hidden: plan doesn't allow or option disabled. Check plan and widget settings.
What's Included in a Turnkey Setup?
- Widget audit: check for duplicate scripts, theme conflicts.
- Design customization: full alignment with corporate style, including custom buttons.
- Display rules: page, time, and device-based rules.
- Integration with 1C and CRM: transfer data from chat to deals and leads.
- Operator training: a 2-hour webinar for the support team.
- Post-launch support: 2 weeks after going live.
According to the Online Chat documentation on the Bitrix24 portal, the widget can be adapted for any scenario.
Why Trust the Setup to Professionals?
With 5 years of experience and over 300 completed Bitrix24 projects, we guarantee: the widget won't flicker, won't slow down the site, and works correctly on all devices. You'll see a 30-80% increase in inquiries depending on your niche. The average payback period for the setup is 3-4 weeks. A turnkey setup typically costs $500-$1500 and can save $2000 per month in lost leads—3 times more effective than the default configuration. Get a free consultation—we'll evaluate your project at no cost. Order a turnkey widget setup—contact us via the form on our website.