LiveDesk Help

Customizing your LiveDesk to fit your live chat operation

Zoho LiveDesk is all about making your customers feel comfortable. Comfortable enough to reach out and connect with you right from your websites. Comfortable enough to open up and ask questions. Comfortable enough to keep coming back.

We realize how important it is for your live chat software to blend in smoothly with the rest of your brand. So we make it easy to customize every customer facing aspect of your LiveDesk. 

Adding a new embed

While you can plug the same embed onto multiple pages of code, or in your template to appear on all of your pages. You also have the flexibility to create new embeds and specifically design those chat portals for specific pages, products, departments or subsets of customers.

You want to create an embed specifically for members of your VIP plan. You can place this portal only on your VIP plans page on your website behind your secure login, giving only these select customers access to this specific chat.

With the ability to create and customize multiple embeds, the possibilities of what you can do, and how you can organize, segment and connect with your customers is endless.

To create a new embed:

  1. Click "Settings".
  2. In the Web Embed section click the "+Add" button.
  3. Enter the name of your new embed.
  4. Choose to associate the embed with a specific department, or choose to “allow users to select department”.
  5. Choose what you want your chat waiting time for this embed to be.
  6. Add a welcome message.
  7. Once you are finished configuring the details of this new embed, Click "Generate". 

Have it your way

Not only can you customize your buttons, widgets, and chat windows to match your brand’s look-and-feel, but we also give you the freedom to choose where and how you include live chat, and give you multiple options of how to display to your customers their ability to connect instantly with you.

Float Window

The float window is a handy way to attract your visitor’s attention throughout your pages without intruding into their on-page experience. When you embed a click-to-chat portal on a page with the Float Window option, you give your customers consistent, easy-to-find access to great customer support through live chat. 

Because the window “floats” along your visitor’s browser, even as he explores a page and scrolls down, your chat widget is still visible.

Finding your LiveDesk Float code snippet

  • Login to your LiveDesk Operator console.
  • Click "Settings".
  • In the Web Embed section, click on the name of the Embed you are attempting to include in a page.
  • Scroll down to the "Button Appearance" section and choose "Float window".
  • Select the code snippet below and copy.

Customizing your float Appearance

Not only do you have options about how and where you present customers paths into chatting with your support agents, but you also have the complete freedom to customize how these different options look, so they fit perfectly into your web presence.

The last thing you need is a pasted-on live chat widget sticking out on your page like a sore thumb. Customers trust and are more likely to utilize live chat when their path to your support operation is seamlessly sewn into your existing web presence.

Which is exactly why we made it easy to customize the look and feel of your float windows.

To customize the appearance of a specific Float Window

  1. Click "Settings".
  2. In the Web Embed section, click the name of the embed you want to customize.
  3. In the "Button Appearance" section, click Change the Appearance. This will display all the options for customizing the float chat.
  4. Make your changes and click "Save".

In the Float Button Appearance screen, you can customize the following:

  1. Theme: Set the color for the background and the border of the float button. For each specific embed, any changes to the theme or colors apply to both the chat button and float button.
  2. Icon: Choose an Icon for the Float Button from the options provided. You can also set the alignment and the placement of a selected icon. These changes also apply to the chat button as well.
  3. Online Status Message: Edit and customize the two lines of text,  both content and color, in the chat button, the first line is shared with the Float Button, and be what your customers see when your live chat operation is online.
  4. Offline Status Message: Program the message your visitors see in the buttons (both float and chat) when your LiveDesk is offline.
  5. Use online theme for offline: Click to switch online appearance on even when all your agents are offline. When switched on only the message will change when your agents are all offline. 
  6. Float button alignment: Set the alignment for the float window. Choose which quadrant you want the button to float over, and use the detailed settings to create a more accurate alignment by either pixels or percentage.  
  7. Float button options: Decide if you want to show a chat bubble above your button, or even customize the image that pops up above your button by uploading your own image.  You can also choose to display your agents who are online or not.
  8. Upload bubble image: Upload your custom float bubble image here
  9. Show agents: Display agents to your site visitors.
  10. Tracking: Track your site visitors in real time.

If you make any changes, be sure to Click Save.

Chat Button

The standard chat button is placed in a desired location on a page to give your customers easy access to your customer support through live chat. Ensure that visitors seeking out solutions see their option to initiate a live chat, by placing buttons where you know curious customers are seeking out for answers.

Finding your LiveDesk Button code snippet

  • Login to your LiveDesk Operator console.
  • Click "Settings".
  • In the Web Embed section, click on the name of the Embed you are attempting to include in a page.
  • Scroll down to the "Button Appearance" section and choose "Embed Button".
  • Select the code snippet below and "copy".

Customizing your button appearance

  1. Click "Settings".
  2. In the Web Embed section, click the name of the embed you want to customize.
  3. In the "Button Appearance" section, click "Change the Appearance". This will display all the options for customizing the chat button.
  4. Make your changes and click "Save".

You can customize the following for the Chat Button:

  1. Theme: Set the color for the background and the border of the Chat Button. For each specific embed, any changes to the theme or colors apply to both the chat button and float button.
  2. Icon: Choose an Icon for the Chat Button from the options provided. You can also set the alignment and the placement of a selected icon. These changes also apply to the float button as well.
  3. Online Status Message: Edit and customize the two lines of text, both content and color, in the chat button your customers see when your live chat operation is online.
  4. Offline Status Message: Program the message your visitors see in the buttons when your chat is offline.
  5. Use online theme for offline: Click to switch online appearance on even when all your agents are offline. When switched on only the message will change when your agents are all offline.
  6. Size: Select the size of your chat button. Choose from small, medium or large options.
  7. Gradient: choose if you want your chat button to display a color gradient or a solid color.  
  8. Shape: Choose the shape of the Chat Button, and further customize the shape by increasing or decreasing the radius and shadow.

No matter what you edit, be sure to click Save to ensure your button will reflect your changes.

Chat Window

The standard chat window can be placed in your desired location on a page to give your customers easy access to your customer support through live chat.

Finding your LiveDesk Chat window code Snippet

  • Login to your LiveDesk Operator console.
  • Click "Settings".
  • In the Web Embed section, click on the name of the Embed you are attempting to include in a page.
  • Scroll down to the "Chat window Appearance" section and choose "Chat window code snippet".
  • Select the code snippet below and "copy".

Customizing your chat window appearance

  1. Click "Settings".
  2. In the Web Embed section, click the name of the embed you want to customize the chat window for.
  3. Scroll down to the Window "Chat Window Appearance" section and click "Change the Appearance".
  4. Make your required changes.
  5. Click "Save". 

In the Chat Window Appearance screen, you can customize the following:

  1. Actions: Enable or disable your visitors from having the power to perform certain actions from inside the chat window. The actions are:
    • Print: being able to print a transcript of the chat
    • Mail: visitor ability to e-mail a transcript of the chat to their inbox.
    • File Sharing: visitor ability to share a file with the agent.
    • Format: formatting text with bold, italic etc.
    • Feedback:option to rate and review an agent after a completed chat.
    • Sound: whether your visitors will be notified with in their live chats.
  2. Custom CSS: You can even upload your own CSS, for advanced control of the look and feel of your chat window.
  3. Theme: Select a pre-programmed theme for the chat window’s color scheme.
  4. Color Customization: Specify the exact color for the header, background of the header, background of the window’s body and the border.
  5. Header: Include (or not) your company logo, agent’s photo and your company’s contact information.
  6. Visitor Information: Configure whether your customers can enter their name, e-mail and contact number (or neither) before initiating a chat, or if you want to make those fields mandatory.

Once you had customized the above, click "Save" to retain your changes

Personalized Chat Box

Live chat not only is great for customer support because it is quick—for both the customer and the agent—but it also can be extremely effective because it is more personal.  Encourage personal connections to your agents, by embedding our personalized chat boxes in strategic places where your customers can see one of your agents, their areas of expertise and a personal message encouraging visitors to connect with them.

Where a sterile, standard button would fail, a personalized call to chat, with an agent’s face and unique greeting, convinces customers that your customer support culture is genuinely interested in helping them.

Finding your LiveDesk Personalized chat window code snippet

  • Login to your LiveDesk Operator console.
  • Click "Settings".
  • In the Web Embed section, click on the name of the Embed you are attempting to include in a page.
  • Scroll down to the "Personalized chat Appearance" section and choose "Personalized chat code snippet".
  • Select the code snippet below and "copy".

Configuring embed specific messages

When your customers click-to-chat with your LiveDesk, and an agent answers that chat, you can pre-program a message to automatically be entered as the chat begins. This message can be customized for each specific embed, to ensure you give a personalized, fitting welcome to each-and-every customer you connect with.

To add a welcome message to a chat embed:

  1. Click "Settings".
  2. In the Web Embed section click on an Embed’s name to enter in that specific embed’s details page.
  3. Hover over the "Welcome Message" section, and click "Edit".
  4. Add the message you want to appear automatically to all customers chatting through this embed.
  5. Click "Save" when you have entered your desired Welcome Message.

Configuring Waiting Times for your embeds

When a customer clicks to connect with you through one your embeds, you can configure the amount of time your agents have to answer and intiate a new chat from an incoming chat request. If an agent doesn’t answer the chat request in the pre-defined time, the visitor’s information will be logged into the Missed visitors section. It is important to determine what you want the waiting time to be for your LiveDesk

To Configure an Embed specific Chat Waiting Time:

  1. Click "Settings".
  2. In the Web Embed section, click on an Embed’s name to enter that specific embed’s detailed information page.
  3. Hover over the "Waiting Time" section, the default will be 60 seconds, and click "Edit".
  4. Choose your desired waiting time, your choices are 30, 45, 60, 90, and 120 seconds.
  5. Click "Save" to confirm the changes you have made.

Thinking Strategically about routing through embeds

Once you have created a few different embeds, you can start thinking strategically about how you want to direct the chat traffic coming in from these portals into your LiveDesk. You have the ability to create and configure specific embeds for specific target audiences, and the back-end flexibility to create departments and associate agents.

For a general embed placed on your index page, you can give customers options and allow them to choose the department they want to chat with. Or from a product specific page you can create an embed and route those chats specifically to a product specific department. However you want to structure your business, we made it easy to configure.

To associate the routing of an embed:

  1. Click "Settings".
  2. In the Web Embed section, click on the name of an embed, to enter the Embed details page.
  3. In the "Department" section, hover over the current details and then click "Edit".
  4. Choose from the drop down list a specific department to route all chats from the embed to, or choose “allow user to select department.”
  5. Click "Save".

There are many times when certain situations arise, that your LiveDesk will display a message to your visitor.

Leave your tone and style on these messages, and further enhance the totality of your customer service experience through live chat.

Configuration for Enabling Signature chat

You can enable the Signature chat from your embed settings here. On enabling it you will get the Signature chat code below.

• Click “Settings”.
• In the Web Embed section click on an Embed name to enter in that specific embeds details page.
• Hover over the signature section, and click “Edit”.
• Tick the check box and “save”
• This will enable the Signature chat for your Embed.

Restrict to Domain

There are instances where spammers can use your snippet code into their website. This might create an artificial increase in chat volumes through harassers or spammers. Adding your website URL will restrict all the incoming chats from other domain.

  1. Click "Settings"
  2. In the Web Embed section, click on the name of the embed, to enter the Embed details page.
  3. Hover over the “restricted “section, and click “Edit”.
  4. Enter your domain URL click “Save” to confirm the changes you have made.

To customize an embed’s display messages:

  1. Click "Settings".
  2. In the Web Embed section, click on the name of the specific embed you would like to edit.
  3. In the Configure Messages section, click "Configure Messages" to bring up the specific messages you can edit.
  4. Hover over each message you want to edit, and click "Edit" to bring up the input box.
  5. Enter your desired message, up to 100 characters.
  6. When you have finished customizing your display messages to your visitors, click "save" under that message’s input box.

You can customize the messages your visitors see for various scenarios:

  1. Waiting — when a visitor is waiting for a chat to begin.
  2. Agents offline — the message they see when all your agents are offline.
  3. Agents busy — the message visitors will see when all your agents are too busy and the chat waiting time has expired without an agent initiating a chat.
  4. Thank you — the message your visitors receive after completing a chat while they give their feedback. 
  5. Agents offline response — after a visitor submits an offline request, the message you send back.
  6. Agents busy response — the message you send visitors after they submit a request while all agents are busy and can’t initiate a chat.

Customizing languages in Web Embed

Web embed picks the default visitor browser language. Changing the browser language will change the languages in your embeds.

LiveDesk supports eighteen languages in embeds.

  •  French
  • German
  • Spanish
  • Dutch
  • Norwegian
  • Turkish
  • Russian
  • Portuguese
  • Italian
  • Korean
  • Japanese
  • Danish
  • Polish
  • Arabic
  • Hungarian
  • Chinese
  • Hebrew
  • Irish 

Setting up your Live Chat Operation for Customer Support

Adding Agents to your LiveDesk

From the moment you create your LiveDesk, your live chat operation is staffed with one agent and administrator—you. But as great as you are, we think LiveDesk becomes infinitely more powerful utilized as a tool for small teams, where everyone can pitch-in and connect with customers as a part of a total-support culture. That is why we made it easy to add your team members to your LiveDesk, so they too can connect with customers and get started delivering instant happiness.

To add an agent to your LiveDesk:

Add Agent-LiveDesk

  1. Click "Settings".
  2. In the Agents section, click the "+Add" button at the top right to add another agent.
  3. Now that you have reached the add agent page, enter an agent’s Zoho e-mail address in the field to proceed.
  4. Then choose what role you want this particular agent to have: Administrator, Supervisor, or Associate.
  5. Lastly, you can associate an agent with your existing departments. Select each department you want to relate an agent with.
  6. "Save" your agent’s configuration and continue.

Creating and configuring your embeds

Your LiveDesk is now up and running, your customers are still visiting your website. Think of chat embeds as the bridge between you and your LiveDesk dashboard, and your website visitors. By creating, customizing and configuring your live chat embeds, you are able to place a portal on your webpages for your customers to connect with you and instantly chat their way to the answers they need.

To view and edit the existing, default embed:

View and Edit Default Embed-LiveDesk

  1. Click "Settings".
  2. In the "Web Embed" section Click on an Embed’s name to navigate to the embed chats details.
  3. Here you can view and edit your current Embed information.
  4. If you have made any changes, click "Save".

Adding your Company's Logo and Details

Before you start chatting with your customers, ensure your LiveDesk reflects your company accurately. Within your LiveDesk it is easy to replace the default logo with your company's logo, which will appear within your dashboard for all your agents to see. Also add your detailed information about your company into your LiveDesk.

To add your company’s logo:

 Add Company Logo-LiveDesk

  1. Click "Settings".
  2. In the Company section, hover over the current logo image and click "Change Logo".
  3. This will pop-up a Choose File window, where you can navigate to your locally stored logo and once chosen, click "Open".
  4. Your chosen file will then be uploaded and inputted automatically.
  5. Click "Save".

Note:

  • For best results, set the dimensions of the logo to 150 (width) by 30 (height) pixels. The file format should either be. jpg,. png or. gif.

To edit your company’s detailed information (including language and time zone):

Edit Company Information-LiveDesk

  1. Click "Settings".
  2. In the Company section, click "Edit".
  3. In the page that appears you can edit details about your company, including Company Name and Website, along with contact information—Address, E-mail, phone number and fax number.  
  4. In this same page you can also choose your LiveDesk’s default language, Time Zone and add an “About the Company” description.
  5. Click "Save".

Defining Departments inside your Live Support Chat

To better organize your Live Support operation, and maximize the ability to connect with customers, we made it easy to create Departments within your LiveDesk. Add all your customer supporting departments inside LiveDesk, and each Department can have their own, dedicated chat widget. Specify groupings of agents for each department to ensure the right agent answers every chat.  

When you created your LiveDesk the system automatically generated a default department, which will have the same name as your portal. 

Departments can either be public or private. Public departments are visible to your visitors and give you the ability to create embeds for these deparments. Private departments are only seen by those inside your company, and are for back office agents, where agents from public departments can transfer chats to these private departments when necessary. 

To view and edit the configured department

View and Edit Default Department-LiveDesk

  1. Click "Settings".
  2. In the Departments section, hover over your department and Click the "Pencil Icon" that pops up.
  3. Here you can edit the department name, description, and choose whether the department is Public or Private. You can also manage the users of this department below.
  4. Click "Update", to save the changes you have made.

Navigating your LiveDesk

Before you go off and start wowing your customers with awesome, on-demand customer support through live chat, there are a few more things about your LiveDesk dashboard you should know. Designed to empower collaborative customer support for small teams, you can squeeze the most power out of your organization’s live chat operation when you work together.

To encourage you and your teammates to communicate, collaborate and thrive, we built LiveDesk’s bottom bar as your collaborative toolbox. The toolbar, which is always accessible, gives you quick access to your teammates, shared knowledge on your portal wide message board, and important updates from your notification center.

My Colleagues Tab-LiveDesk

The first tab, My Colleagues, is your Live Support Chat Operation’s buddy list. With quick access to your fellow online agents, you can connect and ask questions, share thoughts and best practices.

Message Board Tab-LiveDesk

The next tab, Message Board, gives you access to your LiveDesk’s agent-only message board, where you or others can share thoughts, tips, tricks, best practices and announcements with everyone that uses your LiveDesk. Give your agents quick updates, notify everyone of a change in policy, inform everyone of a scheduled downtime—with your Message Board, it is easy to communicate, connect and collaborate with everyone in an organized manner.

Notification Tab-LiveDesk

The third tab, Notification, displays important information to you—including missed visitors and unread chats—with easy access to view and start working on this information. 

Search

But the powerful tools are not confined to the bottom bar of your LiveDesk dashboard. You also have handy access to useful features at the top of your dashboard—including integrated search.

With integrated search built into your dashboard, you have yet another way to save time and work more efficiently. For example, you are currently chatting with a customer who wants to know about linking your application up with a third party mobile app. You know the app he wants to link with sounds familiar, but you can’t quite remember what to tell him about it. With comprehensive search easily accessible you soon discover a canned message detailing the instructions of how to link the apps up, as well as a chat a fellow agent had with another customer a week ago about the same question.

Quickly search and discover instant results without ever leaving your current window, or click More Results For to see all results. You can search your LiveDesk’s visitors—which includes their name and the transcript of chats, Agent Chats, Canned Messages and even Blocked IPs.

Search live chat

Sounds

Also at the top of your dashboard, you can also mute or unmute sounds from your LiveDesk while receiving a chat request. Click the speaker icon to mute the sounds, or if muted click the muted icon (an X through the speaker) to unmute the sounds.

You can also customize the sounds your LiveDesk uses to notify you and your agents of certain events.

Sound Notification

To customize your LiveDesk's sounds:

  1. Click your "name" at the top right corner.
  2. From the drop-down menu click "Personalize".
  3. The "Personalize" window will pop up, in which you will choose the "Sounds" tab.
  4. The LiveDesk sounds are further catogrized into Visitor and Agent Events.
  5. Here by clicking the drop-down menu to the right of each event name, you can choose from different sound options for each event, or choose None if you wish to not have the system notify through sound for that particular event.
  6. Each time you make a change--by clicking the name of that particular sound-- the system automatically saves your new choice. Once you have chosen which sounds you want for each event, simply click the X symbol at the top right to return to the LiveDesk window you were working from.

Visitor Events

These are the sound notification, which takes place when a visitor performs an action.

Sound Notification

  • Incoming Visitor Chat:  the sound notifying you of an incoming visitor chat. By default this sound is a ringer.
  • Visitor About to Leave the Chat:  the sound the system uses to notify you that a visitor is about to leave a chat session.
  • Chat Message from Visitor:  the sound that notifies you each time you receive a message from a visitor.
  • End of Chat:  the sound that notifies you of a particular chat ending.
  • Chat Message from Visitor:  the sound that notifies you each time you receive a message from a visitor.
  • Visitor has left the Chat Session:  the sound the system plays to notify you of a visitor in a particular chat leaving that active chat session.
  • Visitor on-board:  the sound notifying you, when a visitor visits your website.
  • Visitor departed:  the sound notifying you, when a visitor leaves your website.

Agent Events

These are the sound notification, which takes place when an agent performs an action.

Sound Notification

  • Chat Transfer Alert:  the sound that plays to inform you of an incoming chat transfer request from another agent.
  • Invitation for Group Support:  the sound notifying you that a fellow agent has invited you to join in on a group-support chat session.
  • Chat Message from Colleague:  the sound, which notifies you each time you, receive a message from a fellow agent.
  • Message Board Chat Message:  the sound that notifies you each time someone on your team adds a message to the portal-wide message board.
  • Assigned Missed visitor:  the sound that notifies you each time when a visitor is missed.
  • Approval for Blocking IPs:  the sound, which notifies you each time on receiving a notification for blocking IPs.

Themes

You can further customize the look and feel of your LiveDesk by changing the settings or the themes inside the Themes tab of the Customize and Personalize window.

Change your LiveDesk Theme-LiveDesk

To access and change your LiveDesk's theme settings:

  1. Click your name at the top right (You must be an administrator of the account to access the Personalize options).
  2. From the drop-down menu click Personalize.
  3. In the Customize and Personalize window that pops-up above your current LiveDesk screen, click the Themes tab.
  4. Make changes by clicking the radio button of the settings you want, or clicking the icon for the Theme or Pattern you desire.
  5. Each time you make a change, the system updates automatically, so when you are finished configuring simply click the X-icon at the top right to return to where you were working in your LiveDesk

Your options:

  • Layout: For LiveDesk's layout you can choose between Fixed (the default setting, where the main module is a fixed width regardless of browser size) and Stretch (when enabled stretches the width of the main module in to fit the width of your browser, and changes dynamically with your browser.
  • Edge Style: You can choose between Rounded (the default setting) and Sharp where each effects the edges of the LiveDesk main module.
  • Themes: Themes are per-programmed color schemes that make it easy to change the look and feel of your LiveDesk By default your LiveDesk will be in the Neutral theme, with the top bar being gray and the background being a lighter gray. You can choose between six different themes, Dawn, SeeSea, Phyllis, Mystery and Jade.
  • Patterns:You can further customize your LiveDesk by choosing a Pattern that is applied as a skin to the background of your LiveDesk. By default there is no pattern applied. You can choose between Mesh, Sand, Cross, Stripes and Squares.

Your Status

Like other chat programs you are already familiar with, in Zoho LiveDesk you have a status. In LiveDesk your status controls your availability to chat with customers.

Your Status-LiveDesk

There are two statuses:

  1. Green: Available. You are online and ready to chat with customers.
  2. Red: Away. You are busy and don't want to be interrupted. While you still see incoming chat requests on your dashboard, and have the ability to answer them, if all you and all other logged in agents are unavailable customers will see your offline embed.

Set your chat status from the top right hand corner of your Zoho Support screen, where you will see a green or red bar under your account name. To change your status, click your username and from the drop-down menu you will see Available (with a green check mark) or Busy (with a red X), click the icon you see to switch yourself to the other status. 

Setting Up your Profile

Now you can update your profile with your personal information.You can edit and update all of it. You can update your profile picture for the Visitors to view your appearance.

Setting your profile-LiveDesk

  1. Click "My profile".
  2. Click the "Edit" button at the top right.
  3. Now that you have reached to edit profile.
  4. You can enter your Name, and other personal details.

Top