Engage your website visitors with a smooth live chat experience using the eDesk Chat add-on, and create contact forms that allow them to get in touch when you’re not available.

 

 Before you start

  • eDesk Chat is available as an add-on - see here for more information. 
  • You must have access to Smart Tools > Widgets in your Settings. 
 

Customize the look and feel of the eDesk Chat add-on so that it matches your website perfectly, and then add eDesk’s Live Chat to your website.

Setting up eDesk Chat

Step 1:  Customize eDesk Chat so that it matches your website

Open the Settings → Smart Tools → Widgets in eDesk to configure live chat.

 

Pro-tip: Give this a descriptive name so that you can identify it easily.
 

  1. Click + Create New.

    The Choose a type window is opened.



    Pro-tip: Not quite ready to add live chat to your website? You can add a contact form instead, which your customers complete and then click a button to send it to your Agents. Click Contact Form to set it up.

  2. To create a Live Chat box, click Live Chat.

  3. Name your chat, the Channel (website) you’d like it to appear on. You must already have connected this channel to eDesk. Press Finish.  

     

    Next, customize the colors and buttons in the Live Chat box that will be added to your website.
     


     

  4. The title above the Appearance tab name identifies this Live Chat box in the listing on the Settings → Smart Tools → Widgets page. You can change this by clicking Edit beside the title.

  5. Click one of the ready-to-go themes to set the colors in the Live Chat box.
     
  6. If you select the Custom radio button, you can set colors for the Header text, Body text, Header, Border, Body background, and Hyperlinks.

    You can also choose the colors and type of Start chat button and change the text on it, or choose a different button Type. In the button Type dropdown you’ll have the option of selecting Custom HTML, which allows you to edit the html of the button. The Manually triggered from JavaScript option allows you to select an element on the page (for example an existing button) from which the Chat widget can be engaged.
 

Step 2: Tell eDesk how you want the Live Chat to work.
Here’s where you set the text in the Live Chat box, configure how to capture customer feedback, set up a contact form to display to customers when your Agents are offline and set up how the transcripts will look when they are sent to the customer and put into a ticket for Agents.

 

Pro-tip: In the Chat Offline section, you have the option to show the tags from a Tag group in your contact form, allowing your customers to self-qualify when filling in the form. 

Here’s how it works: 

Pro-tip: Style the text in the Transcript Footer field, and include hyperlinks and images using the tools in the toolbar.

  1. Click the Behaviour tab.
    The Behaviour page is opened.


     
  2. In the General section, complete these settings:
     
    • Enable Chat
      Click to enable/disable. If enabled, the Live Chat window will be displayed during Active hours and the Contact form will be displayed outside Active hours.
    • Powered by eDesk
      Click to show/hide this text in the Live Chat box.
    • Language
      Select a language from the menu.
    • Tags
      Select a tag that will be assigned automatically to the tickets created from the live chat/contact form.
  3. The Chat section is where you set up the fields in the Live Chat box. 
  4. The Chat Offline section is where you set up the contact form that’s displayed instead of the Live Chat box when the Agents are offline. If you turn on the Hide widget neither Chat nor Offline Form will be available to website visitors when your team is offline.
    • To do this you’ll need to have already created a Tag group containing a number of tags in it. Then when you select that Tag Group in the Tag Group, for example a Tag Group named What issue are you having?, the tags within this group will be presented as options the customer will have the option to choose from (i.e. faulty item, item hasn’t arrived, etc.). 
    • The ticket that is created will show the tag, giving you further information and even allowing you to create message rules based on how the message is tagged. 

  5. The Chat Rating section is where you choose whether to ask customers for feedback on the chat, and set up the fields that allow them to do so. The Live Chat box is updated to show the chat rating message and fields when the customer has finished the live chat.
  6. The Chat Transcript section is where you set up how the transcript is emailed to the customer. 
    • Subject
      This is the subject of the ticket that is created in the Mailbox, and the Subject of the email that is sent to the customer.
    • Transcript email header text
      The text that is displayed above the transcript in the body of the email.
    • Transcript email footer text
      The text that is displayed below the transcript in the body of the email.
  7.  


     

Step 3: Add eDesk Chat to your website
Here’s where we give you the code snippet to add to your website code. You’ll also position the Live Chat box/contact form on your web page.

Click the Add to Website tab.


 
  1. In the Adding the widget to your website section:
    • Click the Status slider to set it to Active. 
    • Look in the code box if you want to view the snippet that you need to copy.
    • Click Copy.
    • Now paste the snippet below the tag in the code for the web page that will display the Live Chat button.

Note: For more information on embedding the code on popular websites:

  1. In the Positioning on your website section, complete the settings to position the Live Chat button and Live Chat box in your website.
     
    • Position
      Select a position from the menu to choose to put the button/Live Chat window on the right or left side.
    • Offset X
      Set the distance in pixels from the side of the screen.
    • Offset Y
      Set the distance in pixels from the bottom of the screen.
  2. Click Save Changes.
    The Chat add-on has been created, customized and added to your website.
     

What’s next?

Now that you've installed chat, get up to speed on how it will work for you and your agents.