ChatAndBot
How to add live chat to Website?
Start to use
Sign up
How to add live chat?
How to begin chat?
Multilingualism
Setting the language by js.
How to download the Windows application?
How to use the Android app?
Widget customization
How to change appearance?
Setting fields to request information
Settings of the fields for requesting information during chat
How to make individual settings for different pages of the website?
How to add confirmation on consent to processing of personal data?
How to set up an invitation for a visitor?
How can I use JS to send additional information via a widget?
Chat
How to begin chat?
Main features of chat
How to block a visitor?
How to transfer chat to another operator?
Offline chats
How to send chat to archive.
How to use a template answer?
How to add a template answer?
How to get a visitor screen image
How to use the archive
Clients
How to add fields?
How to add a client.
Operators
How to add an operator.
How to bind the operator to the department. If you do not have departments, then attach the operator to the "main department"
How to show the operator in the chat.
Account / Payment
How to change account information (login / password / time zone)
How to delete an account
How to change the tariff plan and pay
Robot
How to attach a robot to a site
How to create bot?
How to create question
How to see the answers in the bot tree
An example of a robot
How to view chats completed by the robot.
how to test a robot
How to connect the chatbot API
How to add a multilingual chat bot?
How to add visual chat-bot to a website
Cookie alert
How to set up a cookie alert
GDPR
How we help you to comply with personal data laws
CMS
How to add live chat to a WordPress website
How to add live chat to a Joomla website
How to add live chat to a OpenCart website
Sign up
Step 1: click the button "Login/Sign up" in the upper right corner.
Step 2: enter your email and password. Password must be between 7-15 characters. Then click on the "Login/Sign up" button. On this registration is completed.
How to add live chat?
Step 1: Click the button 'sites'.
Step 2: Choose your site. When registering, the site "My Site" was automatically created.
Step 3: By clicking on the "Add to clipboard" button, copy the chat code to the clipboard.
Step 4: Paste the code on the page of your site before the </body> tag.
How to begin chat?
Important! You can not open several applications under same login at the same time. For example, if you launched our app in the background on a mobile phone, and then open your account on the site, the app on your phone will turn off.
Step 1:Click the chat button.
Step 2: Change your status to online. The online status is automatically activated when you log in to your account.
Step 3: When a question appears, click on it.
Step 4: In the right panel, write a response in the "Message" field and click the "Send" button.
Multilingualism
The capabilities of the service allow you to customize not only the appearance, but also the text information presented on the chat. Our service allows you to add your own options for 168 languages. And your version will be automatically displayed depending on the browser settings of the visitors to your site. If there is no translation, the default option will be displayed (text in the field).
Multilingualism is supported by both regular text fields and selection fields. In all fields, the add translation button looks like this.
Example of adding a variant for a text field (In fields with a choice of different values, you must first select an editable value).
Step 1: Click on the button.
Step 2: Write the text and select the language.
Step 3: Click the "add" button.
Setting the language by js.
By default, the visitor's language is determined by the browser settings, but sometimes it is necessary to pass a custom value to the chat. This can be done with js code. The variable cab_user_param has been added to the widget script, to change the default operation, this variable must be assigned the following value '&lng=[val]', where val is a two-letter string. For example, to set the English language, you need to do the following.
var cab_user_param ='&lng=en’;
An example of this functionality can be seen on the main page of our website. At the top of the site, you can select the language. Changing the language of the page changes the language of the chat widget.
If you are using the widget as a plugin, then you need to find the place to call the chat in the plugin code and use the capabilities of your CMS to change the value of the cab_user_param variable.
How to download the Windows application?
In addition to the browser, you can use the windows application to work. To download the windows application you need to do the following.
Step 1: Click the "Account" button.
Step 2: Click the "download" button. Once the SetupChatAndBot.msi file download is complete, run the application installation and follow the instructions.
How to use the Android app?
Enter your ChatAndBot account username and password, then press the login button.
Enable message reception.
You can view offline chats by clicking this button. To return to viewing online chats, click it again.
When you receive a message, click on it and reply.
To switch to the background mode, press the "setup" button
In the background mode settings, set the new message alert type and start the mode.
If you are running in the background, you will hear a beep and see a notification from the app when a new message arrives. You need to expand the notification and choose between "ok" and "reply". "Ok" stops the beep and "reply" opens the app to reply.
To deactivate the background mode, you have to go back into the settings and switch it off. The background mode remains activated even after a restart of the phone. If the internet connection is lost, the app will send a notification .
How to change appearance?
Step 1: Click the button 'sites'.
Step 2: Choose your site. When registering, the site "My Site" was automatically created.
Step 3: In the right pane, select the "settings of view" tab.
Step 4: Select the chat item you want to edit
Step 5: make changes and close the form.
Step 6: In the lower right corner, click the "save" button.
Setting fields to request information
Step 1: Click the button 'sites'.
Step 2: Choose your site. When registering, the site "My Site" was automatically created.
Step 3: In the right pane, select the "settings of view" tab.
Step 4: Select "Additional fields settings".
Step 5: Click on the "select additional field" field.
Step 6: Write the name of the field, select its type, if you do not want the field to be mandatory, uncheck it and then click the "add" button.
If you want to hide the field, then click "delete" and the field will go to the right column and become invisible.
Settings of the fields for requesting information during chat
Step 1: Click the button 'sites'.
Step 2: Choose your site. When registering, the site "My Site" was automatically created.
Step 3: In the right pane, select the "settings of view" tab.
Step 4: Select "Additional fields settings".
Step 5: Click on the "select additional field for chat".
Step 6: Write the name of the field, select its type, if you do not want the field to be mandatory, uncheck it and then click the "add" button.
If you want to hide the field, then click "delete" and the field will go to the right column and become invisible.
How to make individual settings for different pages of the website?
Step 1: Click the button 'sites'.
Step 2: Choose your site. When registering, the site "My Site" was automatically created.
Step 3: In the right pane, click on the "page".
Step 4: Write the url or title of the page. In the drop-down list select type and click the "add" button.
Step 5: Click on the added page and configure it.
If you want to return to the main settings, then select the default page.
Widget selection options for website pages
1. URL - setting for pages with a specific URL
2. Title - setting for pages with a specific Title
3. ...URL... - setting for pages where the URL contains your text
4. ...Title... - setting for pages in which Title contains your text
How to add confirmation on consent to processing of personal data?
Step 1: Click the button 'sites'.
Step 2: Choose your site. When registering, the site "My Site" was automatically created.
Step 3: In the right pane, select the "settings of view" tab.
Step 4: Select "Personal information setting"
Step 5: Edit, close the form and click the "save" button. Below are explanations of some settings.
"not show a second time" - if the checkbox is checked, then show to the visitor of site only once, but if the checkbox is not checked, then every time he visits the site.
"Hyperlink to agreement the processing of personal information" - To write a link to your page with agreement the processing of personal information.
"Text of confirmation of consent to the processing of personal data (Add "**" at the beginning and at the end of the area with a link)" - write the text that will be to the right of the checkbox. If you limit the part of the text by **, this part will become a link to your page with agreement.
How to set up an invitation for a visitor?
Step 1: Click the button 'sites'.
Step 2: Choose your site. When registering, the site "My Site" was automatically created.
Step 3: In the right pane, select the "settings of view" tab.
Step 4: Select “Message Settings”.
Step 5: Edit, close the form and click the "save" button. Below are explanations of some settings.
"Open window automatically" - if checked, the chat will open automatically and the invitation will be in the chat. If not checked, then an invitation to appear next to the chat.
"Window Opening Delay (sec.)" - time after which a window will open or an invitation will appear.
"Send automatic message" - if checked, the invitation will be sent.
"Automatically sent text" - invitation text.


If you want to send an invitation and open a chat, you need to check both of this checkboxes.
If you want to send an invitation without opening the chat, you need to check one checkbox.
How can I use JS to send additional information via a widget?
To submit your information you need to:
1. In JS code, create a global variable and name it SeboChat_add_field_param .
2. Assign an array of JSON objects to the SeboChat_add_field_param variable. Each object must have three keys ("name", "value", "id").
"name" - parameter name.
"value" - parameter value.
"id" - a unique identifier which must have a value between -2000 and -1000.
Example code: var SeboChat_add_field_param='[{"name":"account","value":"my account","id":"-1000"},{"name":"balance","value":"10","id":"-1001"}]';
After these steps, your details will appear in the "Additional fields" section.
Main features of chat
button "emojis" allows you to add a emoji to the response text.
button "response templates" allows you to respond by advance created standard answers.
button "cobrowsing" allows you to get an image of the screen of the visitor and highlight the necessary elements.
button "additional fields" after clicking on this button, the visiter will recive fields to fill out. See the field settings in the "Setting fields for requesting information during chat" section.
button "history" allows you to see the history of communication with the visitor.
How to block a visitor?
There are three ways to block a visitor.
1 - by cookie. By this method, the visitor’s browser is marked and operator stop receiving messages from it.
2 - by ip. Messages coming from this ip are blocked. Remember that most users access the Internet through providers that assign ip dynamically and they are not always the same.
3 - by cookie and ip.
To block a visitor, you need to select a method and press the "Lock" button.
How to transfer chat to another operator?
To transfer the chat to another operator, select the operator from the list and click the "change" button.
Offline chats
If all operators are disabled, then chats go to the offline folder. To view these chats, you need to click the "Offline chats" button. After viewing, they need to be sent to the archive.
How to send chat to archive.
To send a chat to the archive, select a chat in the chat list and click the button
How to use a template answer?
There are two ways to use a template answer.
1 - put the cursor in the field for the answer and press the hot key assigned to the template.
2 - put the cursor in the field for the answer and click the button "response templates". A list will appear on the right from which you can select the desired answer.
How to add a template answer?
Step 1: Click the "response templates" button.
Step 2: Click the add button.
Step 3: In the right panel, fill in the name of the template, assign hot keys, write the text, and also chose the type of template (for all or just for you) and click the "save" button.
How to get a visitor screen image
In the chats tab, click the "cobrowsing" button and you will see an image of the visitor’s page.
If you want to select a page element for the visitor, then click on the "Marking mode" button and click on the desired image element. A site visitor will see a frame around the item.
How to use the archive
Step 1: Click the Chat History button
Step 2: Click Find
Step 3: In the search form, specify the search parameters and click "ok". If you want to search for dialogues of robots then turn on the switch "robots". Remember that the dialogs of robots automatically get into the archive.
Step 4: After the search is completed, click the "Close" button and select the chat you want.
How to add fields?
The client card has flexible settings and allows you to add any information about the client. By default, there are no fields in it and you are given the opportunity to form it at your discretion. The fields for the client and the fields in the chat are interconnected, which means that if you add the "email" field to the chat, and then add this field for the client, then when creating a client based on the chat, the email will be transferred to the client automatically.
In our example, we will create new fields and use the previously created chat field.
Step 1: Click the clients button
Step 2: Click the "Form Fields" button
Step 3: From the list of invisible fields, by clicking on the arrow, move s previously added for chat the "email" field
Step 4: In the "name" field, enter "Name", select the type "string" and click "add"
Step 5: Click "Close."
Now we need to configure the fields that we will see in the list of clients.
Step 1: Click "Table Fields" .
Step 2: From the list of invisible fields, clicking on the arrow, to moves the fields "email" and "name"
Step 3: Click "Close."
If there are already clients in the list, then the fields will appear only after refreshing the list and only if they are filled (empty fields are ignored). Fill in the fields on the client card.
How to add a client.
There are two ways to create a new client The main method is based on the chat from the archive tab and the second method from the clients tab. When creating on the basis of the chat, you get the opportunity to bind the chat to the client, as well as all subsequent chats (provided that the visitor does not clean cookies) and read all the client’s correspondence.
Consider the first way to create a client.
Step 1: Click the chat history button and find the chat you want.
Step 2: Click the "add / edit client" button.
Step 3: Fill in the client card and click the "add" button. If you want to see client’s chats, click the chat history button.
Consider the second way to create a client.
Step 1: Click the "Clients" button.
Step 2: Click the add button.
Step 3: Fill in the client card and click the "add" button.
How to add an operator.
A main operator is automatically created when creating an account, it is impossible to delete it, but you can edit it. Below we will analyze an example of adding a new operator.
Step 1: Click the "operators" button.
Step 2: Click the "add operator" button.
Step 3: Fill in the operator’s card, specify the rights to the tabs. Remember that the login must consist of at least five characters, and the password is from seven to fifteen characters. The "nick" and "position" fields support multilingualism and you can customize the option for several languages.
Step 4: Click the add button.
Step 5: Bind the operator to the "main department" department.
How to bind the operator to the department. If you do not have departments, then attach the operator to the "main department"
Step 1: Click the "sites" button.
Step 2: Select a site from the list.
Step 3: Click "Departments." When creating a site, by default, the "main department" department is created and it is not visible in the list of chat departments.
Step 4: Add a New department.
Step 5: By clicking on it, make it current.
Step 6: Click the "operators" button, check the box next to the operator if you want him to answer only questions addressed to the department and click "add".
How to show the operator in the chat.
Step 1: Click the "sites" button.
Step 2: Select a site from the list.
Step 3: In the right pane, select the "settings of view" tab.
Select "Operator settings" (do not forget that if you yourself added an operator, then you need to attach it to the site and department, see the section above if you do not have departments, then attach it to the "main department").
You will see two properties responsible for displaying the operator.
1. "Show operator" - shows the operator at the moment of opening the chat form. The consultant who was free at the time the chat widget was loaded is selected for display.
2. "Show operator after answer" - shows the operator after the consultant's answer in the chat. The consultant to whom the chat was transferred is selected for display.
If both options are selected, then the operator who was free when the widget was loaded is shown first, and after the answer in the chat, the operator will be replaced by the one to whom the chat was assigned.
After changes, click the "Save" button.
How to change account information (login / password / time zone)
To change your account information, do the following:
Step 1: Click the "Account" button.
Step 2: Change the required field and click the "save" button.
How to delete an account
To delete an account, do the following.
Step 1: Click the "account" button.
Step 2: Click the "delete" button.
How to change the tariff plan and pay
Step 1: Click the Account button
Step 2: In the "tariff plans" field, select a tariff
Step 3: In the field "number of operators" write the desired number of operators.
Step 4: If you need to refill balance, then click the "payment" button and follow the instructions, and if the account is filled, then click "save".
How to attach a robot to a site
Step 1: Click the "sites" button.
Step 2: Select a site from the list.
Step 3: Click on the "Connect Robot" button and select a robot from the list.
Step 4: Click on the "Change" button.
How to create bot?
Important! ChatBot answers questions only in new chats (appeared after creating the ChatBot).
Step 1: Click the bots button.
Step 2: Click the "Add Robot" button.
Step 3: Write the name of the robot, as well as select the action of the robot when it can not answer and the operators will be offline. There are three options for action.
1 - send fields to fill out. If you select this option, the robot will send the fields you configured to the visitor. The list of fields is configured in additional fields for chat in the offline section. You can read more about setting these fields in the section "Widget customization / Setting fields for requesting information during chat ". Online mode for the operator, and offline for the robot.
2 - to say the last phrase. The robot will send the phrase that you write in the "Last phrase" field.
3 - Do nothing.
Step 4: Click “Save”
Important: if the robot was able to answer all questions, the chat is placed immediately in the archive, otherwise it is transferred to the operator (if there is a connected operator) or goes to offline chats for further processing.
How to create question
First, let's take a look at how the robot works, and then create an example. Chat in robot terms is a set of questions with synonyms (variants) of these questions and answers to these questions. Chat can touch upon different topics within which there may be identical questions (e.g. if a store sells pens and pencils, the question "how much does it cost?" may apply to both pens and pencils). To create a separate topic, questions with nested sub-questions are used. If during a conversation a visitor asks a question that has sub-questions, then the topic becomes current and the answers begin to be searched inside it (for example, you have two questions “do you have pens?” and “do you have pencils?” with a sub-question “how much do they cost?” for pens, you wrote the answer 50 cents, and for pencils 10 cents. If the visitor first asks the question" do you have pencils? " and then " how much do they cost? " you will get the answer " 10 cents " because the robot will understand that we are talking about pencils). Each variant of the question can be assigned a scope, type of search, the ability to change the current topic on the topic in which the question is located, as well as weight.
The following scopes are available:
1 - Local scope(Question is not visible from other nodes) .
2 - Local area and child nodes (Question is visible in its node and child nodes).
3 - Global scope (Question is visible everywhere).
Full match - the type of search is checked by the "Full match" checkbox. If there is a checkmark (at the beginning we recommend using only this option), then the answer will be found only if the question of the visitor is fully consistent with the phrase written in the "Question Template" field. If there is no checkmark then the robot will check for the presence of words and phrases written and separated by a comma in the "Question Template" field and if all of them are present in the question then the answer will be selected.
make the question node current - if you want to make the question node current, then check the "make the question node current" property. This property is necessary to change the topic of the conversation (for example, in our example, add the question "What color pens do you have?" to make the question global and tick the "make current question node" property. You can now ask this question on any current topic and after the answer, the current topic will be about pens).
Weight - You can assign a weight to a question variant. If several answer options are selected, then the answer with the highest weight will be choose.
To create a question you need to do the following:
Step 1: By right clicking select the node where you want to add a question and then click the "Add question" item of the context menu.
Step 2: Fill in the fields “question template”, “full match”, “make the question node current”, “Weight”, and also set the scope. After filling, click the "Add" button. If you want to add a variant (synonym) of the question, then simply repeat the steps by filling in the fields with new values.
Step 3: Fill in the “Reply” field and click on the “Save” button.
How to see the answers in the bot tree
By default the bot's tree shows the questions, but sometimes it is convenient to see the answers in the tree (e.g. for a robot with pre-defined answer choices for a site visitor). To view the answers you need to enable the "Show answers" option.
An example of a robot
As an example, we will create a robot for a store selling pens and pencils and call it "my shop".
Step 1: create a question about the payment method that can be asked anywhere. The question will have two variants with the answer "Yes, certanly".
Variant 1 - "Is it possible to pay online?". We set " full match" and select scope " local area and child nodes".
Variant 2 - "to pay, online ,?". There is no full match and the answer will be found if the question contains all words separated by commas, and the scope remains the same.
Step 2: Create a theme about Penciles. Our topic will be have one main question and two sub-questions. The main question will be have two variants with a global scope and a full match and with the answer "yes, you can buy it".
Variant 1 - "have you pencils?".
Variant 2 - "can I buy pencils?".
Step 3: To create the first sub-question. With two options and with the answer "we have black and red".
Variant 1 - "what color do you have?". Then set full match and local scope.
Variant 2 - "what colors of pencils do you have?" We set full match, the global scope and set property "make the question node current" Now this question can be asked anywhere in the chat, the answer will be found and pencils will become the current topic.
Step 4: We make the second sub-question with one variant and with the answer "50 cents".
Variant 1 is "how much?". Set full match and local scope.
Step 5: Repeat our actions for pens only in response to the question "how much?" write 60 cents. As a result, we should have something like this.
How to view chats completed by the robot.
If the robot was able to answer all the questions without the help of an operator, then the chat immediately goes to the archive. To view such chats, you need to perform the following sequence of actions.
1. Go to chat history.
2. Press the "Find" button.
3. On the search form, click "Robots".
4. Select search criteria and click “Ok”
5. After the search is finished, click the "Close" button and select the desired chat.
how to test a robot
To demonstrate the possibility of testing the robot, we will check the robot made in the previous chapter.
Step 1: Choose a robot and click on the test button.
Step 2: In the field "ask a question" write "have you pencils?" and click the "Send" button. We get the answer "yes, you can buy it".
Step 3: In the field "ask a question" write "how much?" and click the "Send" button. We get the answer "50 cents".
Step 4: In the field "ask a question" write "what colors of pens do you have?" and click the "Send" button. We get the answer "we have black and red".
Step 5: In the field "ask a question" write "how much?" and click the "Send" button. We get the answer "60 cents".
Step 6: In the field "ask a question" write "Is it possible to pay online?" and click the "Send" button. We get the answer "Yes, certanly".
Step 7: In the field "ask a question" write "what color do you have?" and click the "Send" button. We get the answer "we have black and red".
Step 8: In the "ask a question" field, write "1111111" and click on the "Send" button. Such a question is not provided therefore we will receive the message "No answer found. We transfer chat to the operator!"
How to connect the chatbot API
If you want to connect your application to the chatbot, you can do it using our API. Please note that when working through the API, our service does not save the chat, but simply provides access to the bot. Also for the chatbot can not be set "Actions, if there no operators and answers".

To send the question to the bot, use a POST request to https://chatandbot.com/api/ with the following parameters:

1. test="-1" - constant
2. bid - constant (The value can be found in the settings of the bot)
3. key- constant (This is the access key to the robot. The value can be found in the bot's settings. To avoid unauthorized access, keep it in secret.)
4. pid="0000000000" - initial value (To continue the dialog you must rewrite after each answer. The value "0000000000" means the beginning of a new dialog)
5. ask="" - your question
As a response comes the text in JSON format with two parameters:
1. reply - chat bot reply
2. pid-the new dialog ID to overwrite the pid
If the robot has no answer or if you have exceeded of the tariff limits then reply="" , pid="".
How to add a multilingual chat bot?
The “Multilingual chat bot” function allows you to create a separate chat bot for each language on your website. To create language chat bots, you need to do the following operations.
1. Create a main and additional chat bots. How to do this can be found in the "Robot" section.
2. Bind the main chat bot.
3. Click the "Multilingualism" button.
4. Click on the field for entering a translation and select the desired additional chat bot.
5. Select a language and click the "Add" button.
The additional chat bot will respond if the client's browser is set to the language it is configured for. In other cases, the main robot will respond.
Important! If you selected “To say last thrase” in the “Actions if there is no operator and no answers” setting, then write the last phrase for each language in the main chat bot (this field also supports multilingualism), and not in additional ones.
How to set up a cookie alert
Step 1: Click the button 'sites'.
Step 2: Choose your site. When registering, the site "My Site" was automatically created.
step 3: Select "Cookie setting"
Below we will describe some settings of the form:
"Show warning" - A warning will only be displayed if a checkbox is checked.
"Do not show warning a second time" - If you check this box the warning will not be displayed when the visitor returns to the site.
"Do not show the warning a second time within the same visit to the site" - If you check the box, the warning will be shown once every time you visit the site.
"Block Page" - If you check the box, the page will be blocked. The blocking will be removed after clicking the button on the cookie warning form.
"A link to a page where for example there may be a cookie policy" - A link to your web page that may describe the cookie policy.
"Text of confirmation on consent to processing of cookies" - Warning text. If part of the text is placed between **, this part will become a reference to the address given in the previous paragraph.
"JS code for the button" - Two buttons can be added to the form. By default, they just close the warning form, but you can extend their functionality by adding your js code to any button.
How we help you to comply with personal data laws
Many countries are now concerned about the protection of personal data. As a result, personal data protection laws have begun to appear in many countries, in particular in the EU, the GDPR. It is important to know that if you do business outside the EU and have taken personal data of an EU citizen when he or she was in the EU, you are obliged to process it in accordance with GDPR otherwise you may be fined (fines can reach millions of euros). Another important point is that the laws do not have a clear and exhaustive list of personal data and the final decision remains at the discretion of the court and, theoretically, even if you ask for email address or find out the phone number you can become a personal data operator. In these conditions, the best solution is not to take information about visitors, but often it is impossible, for example, if you are an online store then you need to be able to contact the customer at least to deliver the goods. In these challenging circumstances, our service helps you collect and store information without violating these laws. Below we have listed the main points of these laws and our decision.
"Personal information" - If you collect personal information, you need to request confirmation of the visitor's consent to transmit it to you in the form of an active action by the visitor, as well as to have on the site a document called "consent to the processing of personal data" (the requirements may vary from jurisdiction to jurisdiction). If our widget is used to collect information, you can add a confirmation of consent to the processing of personal data (for more details see "Widget customization->How to add confirmation on consent to processing of personal data"), the visitor's action will be to tick the box.
"Download information in json, xml or csv formats" - Our service provides the possibility of downloading in all three formats.
"Removal without recovery" - Anything you delete in our service will be deleted without the possibility of recovery.