How to Edit and Add Chat Plugin?

Function Introduction

After adding a chat plugin to your independent website, you can automatically reply to visitor messages directly on your website pages without redirecting to other pages, improving chat conversion rates. Moreover, you can add traffic-driving components to the chat plugin, allowing visitors to jump to corresponding traffic channels by clicking, achieving the benefits of traffic marketing and distributed customer service.

As you can see, adding a chat plugin can solve many customer service scenario requirements. This article will explain how to add and edit a chat plugin.

Operation Process

1. Add Chat Plugin

Click Chat Plugin under Connections > Click Add to enter the addition interface.

After editing the chat plugin name, create the chat plugin.

Enter the site connection page to install the chat plugin on your website, or access personalized style settings.

 

1.1 Install Plugin

You can install the plugin on your website. Installation methods are as follows:

•For self-built websites: You can install SaleSmartly on your website using the JavaScript code under "Others".

1.1.1 Install SaleSmartly on Self-Built Website

After accessing the server where the site is hosted, find the file containing the tag (usually index, please consult the site's development engineer for details), open the file, paste the JavaScript code before the tag, save the changes and the installation will be successful.

• You can install the plugin on various sites, including Shopline, Shoplazza, Shopify, Shopyy, etc. For details, see:

How to install SaleSmartly on a standalone website

 

The following shows you how to install SaleSmartly in your ShopLine app store, and the same goes for other independent sites:

 

 

 

 

2.Edit Chat Plugin

Enter the chat plugin editing interface, where you can see two main areas. The left side is the configuration area, including: Chat Plugin Section, Entry Configuration, and Other Configuration. The right side is the preview area.

When you edit the chat plugin in the configuration area, you can preview the edited plugin style in real-time on the right preview area, making it convenient for you to edit the plugin.

The following will introduce each section of the configuration area in detail combined with the preview area.

2.1 Chat Plugin

Configure basic settings and content settings for the plugin, including theme color, brand name, homepage mode, content expansion, etc.

2.1.1 Basic Settings

•Chat Plugin Name: Refers to the name of this chat plugin (visible to customer service only).

•Brand Name: Refers to the display name of this chat plugin to the public

•Theme Color:You can customize the main background color after the chat plugin is expanded, as shown below.

•Brand Logo: Refers to the avatar on the left side of the title at the top of the chat plugin.

•AI Agent Avatar: Refers to the avatar of the message sender when the bot replies to visitors.

•Language: You can set the language of prompts within the plugin, including prompts, button names, error feedback, and other display languages.

•Homepage Mode: You can set whether to enable homepage mode for the chat plugin.

2.1.2 Content Settings

•Subtitle: After setting, it will be displayed in the chat plugin information bar, serving as auxiliary supplementary explanation. Can be customized to enable.

• Subtitles support switching subtitle content based on whether customer service is online.

•Notice Board: You can set content that needs customer attention, such as promotional ads and customer service hours, to be displayed in the notice board. You can also set personalized options such as notice board color and content links to help you achieve precise marketing.

•Content Expansion: You can set your help center document address. Visitors can jump to the corresponding link in the chat plugin to view relevant help documents.

•Information Survey: You can collect user information such as name, phone number, and email by setting "Pre-chat Survey" and "Offline Lead Capture".

•Pre-chat Survey: After enabling pre-chat survey, visitors must fill in the survey information you set when they open the chat window before they can send messages to you. Both pre-chat survey and offline lead capture support adding up to 4 fields, including email, name, company name, phone number, and custom fields. You can also set whether fields are required and delete/adjust fields.

•Offline Lead Capture: After enabling offline lead capture, when no customer service is currently online, visitors must fill in the survey information you set before they can send messages to you.

•Lead Capture Button: After enabling, a lead capture button will appear in the chat window, and visitors can click it voluntarily to fill in information.

•Force Popup: After enabling, visitors cannot send messages before completing lead capture (if not enabled, visitors can choose to close and skip lead capture).

Comparison: Pre-chat survey tends to require customer information before starting a conversation, while offline lead capture tends to be a method of collecting customer information when no customer service is online.

2.2 Entry Configuration

Configure the entry style, entry layout size, channel integration entry, etc. of the chat plugin.

2.2.1 Entry Style

•Entry Collapsed: Default is icon not collapsed, as shown below.

Enable icon collapse to consolidate the display icon into a single one. Two styles can be set: collapse to sidebar or collapse to single icon.

2.2.2 Entry Layout

•Entry Position: You can set whether the chat plugin is displayed on the left or right side of the website.

•Custom Icon: Divided into default icon and selected icon. Default icon refers to the style when the mouse is not hovering; selected icon refers to the style when the user hovers or clicks the icon. The system comes with default styles, and both styles can be customized.

•Mobile: You can set the entry icon size and position displayed by the chat plugin on mobile devices. Three styles can be set: small, medium, and large.

•PC: You can set the entry icon size and position displayed by the chat plugin on PC. Three styles can be set: small, medium, and large.

•Bottom Distance: Refers to the height from the plugin/sidebar to the bottom of the website. Can be set from 0px to 500px.

2.2.3 Channel Integration Entry

•Channel Integration Entry: You can display multiple channel entries on the webpage or within the chat plugin, including chat plugin, Messenger, Line, WhatsApp, Email, etc., to help you achieve traffic-driving effects.

•Display Effect Within Window: When the chat plugin has homepage function enabled, entry style is set to collapsed, and integration entry style is set to display within window, channel entries will be displayed on the homepage.

When homepage is not enabled, the display effect is as follows: mouse hover expands channel entries.

2.3 Other Configuration

You can set chat settings and display settings, etc.

2.3.1 Chat Information Settings

•Unread Message Preview: When enabled, when your chat plugin is not expanded, the first unread message from visitors can be displayed next to the icon. Supports displaying the first unread message or the latest unread message.

•Message Recall Notification: When enabled, visitors can see notifications when customer service recalls messages.

2.3.2 Display Settings

•Specify Page Display: When installing the plugin to your independent website or webpage, the plugin will be displayed on all pages of your website by default. You can use display configuration to configure which pages need to display the plugin and which pages do not need to display the plugin. The same applies to mobile.

•Mobile Chat Page Full Screen: You can set whether the chat plugin window fills the entire screen or displays half-screen when visitors chat on mobile devices.

•Auto Expand: You can set how long after a user enters the website for the chat window to automatically expand, facilitating users to inquire about products immediately, as well as intelligent settings such as automatically opening for new users.

•Window State: When visitors close your website or switch to another website and then return to your website, the chat plugin window maintains its previous expanded or collapsed state.

•Access Restriction: You can set to hide the chat plugin based on the user's IP location or specific IP addresses accessing your website.

2.4 Save