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.

This help file will guide you through setting up a Live Chat or a Contact form on your website or webstore.


Before you start

 
  • The eDesk Chat is available as an Add-On. To find more information, click here. 
 
  • You’ll need to have access to Smart Tools > Widgets in your Settings. If you don’t have access, you can request it from an Admin user within your business. 

01 Setting up eDesk Chat

 

Step 1:  Create a new Live Chat, and customize it to match your website.

  1. Go to Settings → Smart Tools → Widgets.
  2. On this page, click Add a Widget and you'll be able to choose between creating a Live Chat or a Contact Form. Pro-tip: Give the chat or form a descriptive name so that you can identify it easily in the list.

  3. To create a Live Chatbox, click Live Chat. 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. In this instance, click Contact Form to set it up.

  4. Name your chat and select the channel (website) you’d like it to appear on. You must already have connected this channel to eDesk. Then click Finish.  

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

  5. 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.

  6. Click one of the ready-to-go themes to set the colors in the Live Chatbox.

  7. 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. 
 

Step 2: Tell eDesk how you want the Live Chat to work.

The Behaviour tab is 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 Support 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 to open the Behaviour page.
  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 Chatbox.

    • 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 Chatbox. 

  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 Chatbox 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.

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.

1. Click the Add to Website tab.

2. 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:

3. In the Positioning on your website section, complete the settings to position the Live Chat button and Live Chatbox on 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.

4. Click Save Changes.

The Chat add-on has been created, customized, and added to your website. Well done!

Further Readings

 

To find out more about how the Live Chat or Contact Form will work for your agents, click here.

Interested in learning more about Website contact forms? Click here.