Desk360 Docs
Search…
User Communication Channels
Desk360 Platform Navigation
Desk360 Mobile SDK
DESK360 MOBILE CHAT SDK
DESK360 API (beta)
Live Chat Channel Integration
With the Live Chat module, you can easily make instant conversations with your customers on the Desk360 platform and increase customer satisfaction.
For integration, navigate to Product and Channels > Product selection > Edit Channel > Live Chat and follow the instructions on the page.
To add a live chat widget to any web page, all you need to do is copy the code below and paste it under the <body> tag.
How to integrate?
1
<script type="text/javascript">
2
function initDesk360Chat() {
3
window.desk360Chat.init({
4
token: "7NLa8CcdPo6DcEerAISOcnzlAtotVSXVqrKPhA7ePPOa5h36yhSpHfn5ORbQ3bseEiPQjYB2dNlmSaLg",
5
host: "https://teknasyon.desk360.com/"
6
});
7
}
8
9
function initialize(t,i){var e,a=btoa((new Date).toDateString()).toLowerCase();t.getElementById(i)?initDesk360Chat():((e=t.createElement("script")).id=i,e.async=!0,e.src="https://teknasyon.desk360.com/widgets/chat/sdk.js?".concat(a),e.onload=initDesk360Chat,t.head.appendChild(e))}function initiateCall(){initialize(document,"desk360chat-js-sdk")}window.addEventListener?window.addEventListener("load",initiateCall,!1):window.attachEvent("load",initiateCall,!1);
10
</script>
Copied!
Auto Login
By using the sample code below, you can let users who have sent you a message before, automatically start a new conversation without filling out the login info form.
1
function initDesk360Chat() {
2
window.desk360Chat.init({
3
token: "gbAKbBGp0pRcT1OF9SGH8MDDzXnMDjuc6gfsV6kXTN0EsDcfBBJvxqAR2b5OaPwtpyFBRyH1YvIMC8Gs",
4
host: "https://desk360-backend.desk360.com/",
5
user: {
6
name: "John Doe",
7
email: "[email protected]"
8
}
9
});
10
}
Copied!
Configured Language
By using the sample code below, you can decide in which language you want your web widget to be initialized. In the below code the key locale is used to set the language when the widget is initalized. You can see the list of all supported languages and their keys in the table below.
1
function initDesk360Chat() {
2
window.desk360Chat.init({
3
token: "gbAKbBGp0pRcT1OF9SGH8MDDzXnMDjuc6gfsV6kXTN0EsDcfBBJvxqAR2b5OaPwtpyFBRyH1YvIMC8Gs",
4
host: "https://desk360-backend.desk360.com/",
5
locale: "en"
6
});
7
}
Copied!
Language
Language Code
Arabic
ar
Armenian
hy
Azerbaijani
az
Chinese (Taiwan)
zh-tw
Chinese (Traditional)
zh
Czech
cs
Danish
da
Dutch
nl
English
en
French
fr
Georgian
ka
German
de
Hebrew
he
Hindi
hi
Hungarian
hu
Indonesian
id
Italian
it
Japanese
ja
Kazakh
kk
Desk360 Chat Javascript API
You can decide on which page you want to trigger or hide your live chat widget by using the codes below.
For hiding the widget:
window.desk360Chat.hide()For showing the widget:
window.desk360Chat.show()For triggering the widget:
window.desk360Chat.open()For minimizing the widget:
window.desk360Chat.close()You can use the sample event code below on your single-page app-based websites. You can ensure that your customers who switch the language of your website see the live chat popup in the language they selected. Select the language you want your live chat widget to be displayed in, then copy the code from the table below and paste it into the corresponding locale field.
window.desk360Chat.reload({locale: tr|en})How to customize?
After integrating the live chat widget into your website, click the Customize button on the home page to start customizing your newly integrated widget. Widget customization allows you to determine the color scheme of the module, change how it looks, enter custom texts, and create timed messages to encourage your visitors to get in touch with you.
There are 5 options available when you start customizing your live chat widget.
1. General Settings
On the General Settings tab, you can decide on the design and the color scheme of your widget and the texts you want to display on the home page.
Triggered Messages
Languages
Product Settings
Themes
Greeting
Background Colors
Start Chat Box
With the Enable Triggered Messages option, you can create automatic question and answer messages of which you can determine the duration. After clicking the option, you can create trigger messages by following the steps below:
- Enter the message you want site visitors to see in the Triggered Message box and the corresponding reply to this message in the Auto Reply box.
- Set how many seconds visitors will see the automatic messages after visiting your site in the Duration section. The specified time for displaying the messages cannot be more than 60 seconds.
- You can use the Add New button to add more than one automatic message. You can create up to 5 automatic messages.
The predefined texts on the chat module are available in 40 languages and are professionally translated. These are displayed according to the language of the visitor’s browser. In case your customer’s browser language is not one of the 40 supported languages, texts will be displayed in the default language. Click here to see the language list.
This field needs to be filled in for the product name to appear on the main page of the chat module. You can also decide on whether you’d like to show the profile photos of your online customer representatives here.
Chat Icon: Desk360 offers you three different icon options. You can determine the appearance of the button you want your customers to click on when they want to reach out to you.
You can choose a theme closest to your brand image and you can make any kind of customizations on these themes.
You can either use the header texts provided by Desk360 in 40 languages or you can add your own texts into the system.
Here you can customize the background colors on the theme you’ve chosen earlier.
You can manage all customizations you’d like to do from this field.
2. Offline Settings
In this section, you decide how you want to greet your customers in the absence of an online customer representative to answer live chat messages sent to your brand. Since all customer representatives will be offline, you welcome your site visitors with a form and request them to fill in the name, email, and message fields, and let them reach you via email.
Header
Custom Fields
You can enter text in this field that you want to appear in the profile section, or you can continue to use the text provided by Desk360.
In this section, you welcome your site visitors with a form, as there will not be an online customer representative to respond to live chat messages. Visitors can reach you via email by filling in the name, email, and message fields. Name, email, and message fields are the fields that are displayed automatically, but in cases where you want to get more information from your site visitors, you can make the necessary additions from the custom fields section.
3. Online Settings
In this section, you decide how you want to meet your customers when there are online customer representatives who will answer live chat messages sent to your brand. Since your customer representatives will be online, they can instantly reply to all messages that your site visitors write to you on the Live Support page and provide them with live support.
In the Header field, you can enter text that you want to be displayed in the profile section, or you can continue to use the text provided by Desk360. You can also decide on whether you’d like to show the profile photos of your online customer representatives here.
4. Chat Page
In this section, you can edit the chat bubbles, specify colors and texts, and make all the customizations you want to the form field.
Functionality
Chat Settings
Writing Field
Form Area
Actions
Form Settings
Auto Reply Message
Checkbox
By enabling the Add Files button, your website visitors will be able to send you the files in almost every format. Click here to see these formats.
By enabling the Send Transcript button, website visitors will be able to get transcriptions of their chat history with the customer representatives.
The color customization defined for the header of the live chat module is also valid for the color customization of the chat bubbles of the site visitors. For example, suppose you select the header background color as black from the General Settings tab. In this case, the background color of the chat bubble for the site visitors will be automatically defined as black. Besides, each color customization defined for the background color is valid for the color customization of the chat bubbles belonging to customer representatives. For example, suppose you select the background color as white in the General Settings tab. In this case, the background color of the chat bubble belonging to customer representatives will automatically be white. Chat Settings allows chat bubble customization for customer representatives only. From this section, you can change the colors as you wish.
In this section, you can decide the color of the text and icons in the writing field.
It is required to fill in the fields on the form. When site visitors want to submit the form without filling in the required fields, they receive an error highlighting the blank fields. You can decide by which color you want the empty fields to be highlighted with the Placeholder Color.
You can decide on the translation of the button that allows the form message to be sent to businesses in 40 languages from this section.
With this option, you can encourage your site visitors who want to contact you by filling out the form.
With this option, you can edit the success text that will be shown to your site visitors who fill out the form to contact you.
You can make obligatory for your customers to check the box in order to start a chat with you or send you a message. You can add your Terms of Use or Privacy Policy as a checkbox text. You can translate your texts into 40 languages, lead them to a web link, or make them Bold or Italic.
5. Survey
With the Survey page, you can measure whether your site visitors are satisfied with the support service they receive.
Texts
Icons
You can edit all the texts you want to appear on the screen from this section, or if you wish, you can use Desk360 texts with professional translations in 40 languages.
With the Survey page, you can measure whether your site visitors are satisfied with the support service they receive. You can customize the colors of the icons on this page or use the default colors.
Last modified 1d ago