Getting Started with Telegram Chat

1. Adding the content

The process of creating your Telegram Chat widget starts with adding the needed info on the Content tab. 

First of all, you need to add your Telegram Account or Group (username or link): Then move to the next sections such as Chat Bubble, Chat Header, Welcome Message, and Start Chat Button. 

2. Triggers and Display settings

On the next tab of your Telegram Chat widget you can adjust display settings using 4 sections: Position (1), Chat Display Settings (2), Open Chat Triggers (3), and Notifications (4): The Position section allows you to change your widget's position and alignment:  In the Chat Display Settings section you will have the opportunity to:

1. All Pages – with the help of this option the widget will be displayed on every page of your website
2. Excluded Pages – if you choose this option, the widget will be displayed everywhere except for these pages
3. Specific Pages – you can select this option to display the widget only on particular pages of your website

If you'd like to display the widget on the homepage or hide it from your homepage, this article will help you - How to display Telegram Chat only on homepage or exclude it from homepage

Choose Devices where you want to see the widget

Select the category of Visitors you want to display the chat for

1. All visitors – all your visitors
2. New visitors – visitors who have come to your website for the first time
3. Returning visitors – visitors who had been on your website before

Set Date and Time where you can tick the days you need your chat widget to be active on your website (1). Also, you're welcome to set the start & end time and the needed time zone if necessary (2)

1. Time on Page – set the time in seconds a website's visitor has to spend on the page to open the chat
2. Time on Site – set the time in seconds a website's visitor has to spend on the website to open the chat
3. Scroll Position – set the scrolled page percentage for the window chat to open automatically
4. Exit Intent – enable this setting to open the chat window automatically every time a visitor intends to leave the website or close the browser tab



Important

Please keep in mind that you're able to use only one trigger at a time. In case you set up multiple triggers at the same time - none of them will work.

Notifications section will let you keep or remove the red badge to draw visitors' attention to the chat window and make the notification about one new message display in the browser tab once the chat window opens:

3. Appearance of the widget

When you end up with the display settings of your widget, you can move forward. With the help of the Appearance tab, you can adjust  how your widget will look using these 4 sections - Colors  (1), Bubble Animation (2), Start Chat Button (3), Custom CSS (4): And here’s what you can do:

1. Choose your Colors. You're welcome to change Bubble Background Color, Bubble Icon Color, Button Color, and Header Background Color
2. Turn off/on your Bubble animation and set animation interval in seconds
3. Choose Button Corner Radius
4. Add a CSS Code. This section will let you add the CSS code for your widget customization