Chat widget

Table of content

Chat widget customization
CSS Customization
Language on chat widget
Pre-chat form survey
Chat Button and Chat Bubble

Subiz chat widget is a chat box which is integrated on your website, it becomes a very important part of your website. Your visitors use this chat widget to talk to Agent right on website.

To config theme settings of chat widget, go to Dashboard > Settings > Chat widget > Theme/Language/Chat button/Form survey

To bring visitors a great experience, we made chat widget mobile-friendly.

widget-on-web

Chat widget customization (Theme)

  • Widget position

You can freely position Subiz’s chat widget at the bottom of left or right corner on your website.

widget-position

  • Default avatar

avatar

Default avatar is the image which is placed at the Agent information’s position (Image) when visitors open chat widget but still don’t start chat with any agent.

  • Logo

To earn the customer’s trust you can add Logo into Chat widget. It lets your customer know that they’re contacting the right company (Image)

Notice: Image must be less than 50Kb. The standard size is: 100x35px

logo

  • Social pages

social

You can add your Facebook fanpage or Twitter on Chat widget (image).

CSS Customization

CSS stands for “Cascading Style Sheet”. If you have some knowledge about technical, HTML, you can customize your own style by coming to Theme settings

customize

Click Customize (Image above), paste your CSS code into text editing field and click Save changes

show-css-code

Read more about CSS customization

Language on chat widget (Language)

language

You can choose Auto Detect mode, or a specific language in Settings. Besides, you can use API to set a certain language for website.

  • Auto detect is a feature that helps you detect the visitor’s country name and display the corresponding language. In case that language is not available, English will be displayed.

label

  • At the moment, Subiz is supporting 13 languages. They are English, Vietnamese, French, Italian, Spanish, Portuguese, Dutch, Persian, Simplified Chinese, Arabic, Bahasa Indonesia, Thai, Filipino . When you choose a certain language, you can customize to change the text instead of using default with Auto-detect option.

Pre-chat form survey (Chat survey)

Form survey is a tool to ask visitors for their information like Name, Email, Phone…When form survey is activated, you can customize to ask visitors to choose departments, insert name, email, phone or their questions.

This tool is used for:

  • Getting visitor’s information: Name, Email, Phone…
  • Routing chat request to a chosen department (You need to activate Department to use this)

form-survey

To set up pre-chat form survey, go to Chat widget settings > click on Chat survey

form-survey-setting

You can click to Customize (Image) to change the text on form survey. Notice that you cannot change this if your language mode is Auto-detect

Form survey includes:

  • Name (Default)
  • Email (Default)
  • Phone (Customizable)
  • Department (Customizable)

Contact us if you need different pre-chat form survey customization.

Chat Button and Chat Bubble

Chat Button: is kind of image you freely place on your website for visitors to start a chat.

button-chat

How to set up Chat button:

  1. Chat widget Settings > click on Chat button
  2. Choose an image in Gallery or upload your button.Notice: The image file can be PNG or JPG, size must be less than 50Kb, Standard dimension is 240x164px. Chat button has both online and offline mode, you can design an image for both.
  3. Click “Get code” to get chat buton’s embed code to paste into your website HTML file.

code-button

Chat bubble: is a graphic that get visitor’s attraction to chat widget. It can help raise more interaction.

Chat bubble only displays in Online mode.

bubble

How to set up Chat bubble

  1. In Chat button settings
  2. Select Enable chat bubbleenable-bubble
  3. Select Chat bubble in Gallery or upload your own image.

Notice: Size must be less than 50Kb and recommended dimension is 240x160px