How to install and configure online chat widget
The Umnico widget is a button on your website that allows visitors to contact you via online chat, Telegram, VKontakte, and other messengers. All messages are delivered to a single Umnico window.
To install the website chat, create and configure the widget in the "Channels" → "Website chat" section, copy the code, and add it to your website pages.
1. Go to the "Channels" → "Website chat" section
In the left-hand menu, click "Channels". The page has two tabs: "Main" — for messengers, and "Website chat" — for configuring the widget.
Open the "Website chat" tab. The "Website chat" tab is located in the "Communication channels" section.
2. Create a new widget
Click "+ Website chat" next to the tab.
Come up with a name for the widget. It is displayed only in your account — website visitors will not see it. If you have several websites or landing pages, name the widgets according to their purpose, for example: "Main website", "Landing page May 2025", "Online store". This will make it easier to distinguish the widgets from each other.
3. Configure the website chat widget
After creating the widget, an editor with several sections will open. Configure the widget settings in each of them.
Settings
In this section, you can specify the widget name, time zone, working hours, button color, and button position (left or right).
Online chat
Enable online chat, select the color of the window and messages, and configure automatic chat opening after N seconds.
Messengers
Add links to your messengers — Telegram, VKontakte, MAX, and others. The website visitor will be able to choose where to send a message.
Quick replies
Configure prompts for visitors — frequently asked questions that they can send with one click. Available languages: RU, EN, DE, ES, PT.
4. Copy the widget code
Scroll down to the "Installation" section and copy the code to add to your website. The "Installation" section contains the code unique to your account.
Do not use someone else's code: each account has its own hash. The code from the example above will not work.
5. Install the code on your website
Insert the copied code on every website page before the closing </body> tag.
Choose your platform:
Custom website
- Open the template file that is included on all pages (usually layout.html, base.html, or footer.php).
- Find the closing </body> tag.
- Insert the widget code directly before it.
- Save the file and check your website — the widget will appear in the bottom-right corner.
Tilda
- Open the editor of the required website in Tilda.
- Go to Site Settings → More → HTML code for insertion.
- In the "Code before </body>" field, insert the widget code.
- Click "Save" and publish the website.
The code is added once for the entire website — there is no need to insert it separately on every page.
WordPress
- Install the Insert Headers and Footers (or WPCode) plugin.
- Go to Settings → Insert Headers and Footers.
- Insert the widget code in the Scripts in Footer field.
- Click "Save".
If you have access to the theme editor: Appearance → Editor → footer.php → insert the code before </body>. However, the plugin is more reliable — the code will not be removed when the theme is updated.
Bitrix
- Log in to the Bitrix administrative panel.
- Go to Settings → Sites and Servers → Sites.
- Select the required website → HTML code of pages tab.
- Insert the widget code in the "Before </body>" field.
- Save the changes.
React
If your application uses Create React App, insert the code into public/index.html before </body>.
If you use Next.js, add it via the Script component in _app.js or layout.tsx.
6. Check that the website chat is working
Open your website in a browser. The chat button should appear in the bottom-right corner.
Click the button and send a test message. It will appear in the "Chats" section of your Umnico account.
You can also test sending messages within the Umnico interface. To do this, click the "Test chat" button.
Widget not appearing? Check that: the code is inserted on all pages (not just the home page); the hash was copied completely without extra spaces; the page was saved and published after the changes.
Help & Support
If you have any questions, feel free to contact us — we're happy to assist. To reach Umnico support, click the "Support" bubble in the bottom-right corner of your screen. Or go to the "Help → Chat with Support" section in your Personal account.