Setting up the Live Chat widget on your website is easy. Create the pop-up form, embed it in your website, and you’re ready to go. The pop-up form functions both as a as a Live Chat portal and Contact Form for when you’re offline.
If you have already integrated a Live Chat widget on a webstore with Xsellco Helpdesk, you can skip straight to the end section, ‘Useful Links for Embedding HTML code on your Webstore’ to learn how to add / edit HTML code on Shopify, Magento, Bigcommerce, WordPress and Woocommerce.
Set up your Live Chat widget
- While logged into your XSellco dashboard, click on the Chat tab in the top navigation bar.
- In the Chat screen, select See your widgets here.
- Select Add new widget in the top right corner.
- Name your Live Chat widget e.g. BigCommerce Live Chat > Select the Channel you would like to add your Live Chat to > Select Pop-up form in the Type section.
- Select Create Widget
Add the Live Chat widget to your website
- To activate the Live Chat once you are finished, select Active.
- Copy the Embed code and paste this code into the <body> section of your website HTML.
Customize your Live Chat widget
Next, you will need to customize your Chat widget settings for your chosen Channel. Go through each tab to make sure your Chat works exactly as you need.
- Show delay: Choose how many seconds you would like a visitor to stay on the page before triggering the Live Chat pop-up.
- Position: Choose where you would like the Chat window to appear on your website.
- Customize your text and background colours
- Choose if you would like Chat messages to be automatically sent to specific folders.
- This section allows you to customize your Contact Form with the kind of messaging that you would like customers to see when you are offline.
This section allows you to enable or disable Live Chat, and customize the text that appears on your Live Chat pop-up.
- Select Chat enabled to enable Live Chat on your website. If you do not want to enable Live Chat, keep this disabled, and your widget will only ever appear as a Contact Form. Contact Form queries will always appear in your messages dashboard as tickets.
- Select Hide widget if you would prefer that Live Chat is not available when all agents are busy.
- Customize the text on your Live Chat widget using the additional fields
Once you are happy with your customized Chat widget, select Save changes. Your Chat widget will now be activated to pop-up on your website.
Set your Live Chat availability
The final step will be to select the working hours that you would like to be available on chat. Each agent can do this separately in their own account once you have added them as a User. Otherwise, each agent’s availability will be based on the working hours you set here.
- Go to Settings > Account Settings > Chat
- In Max concurrent chats, select the volume of chats that you would like to be able to handle at any one time.
- Choose how many minutes you would like to stay online for during inactivity using Away time out.
- Scroll to Online working hours to select the days and times that you would like to appear online.
- Select Save changes.
Once you are online, you will now start to receive conversations into your Chat dashboard in the top navigation bar. When offline, customer’s messages will default to the Contact Form and will be displayed in your Messages dashboard.
When chat is enabled, only Admins will be able to access the chat functionality. To enable your agents to use Live Chat, you must give them permission.
- Click on Settings > Users in the left menu column.
- Click on the agent you wish to enable.
- Check the Chat tick box to enable Chat and click Save.
Once an agent is enabled by the Admin, the agent can select their own availability and how many chats they would like to take part in.
To show as Online or Offline, the agent must click the dropdown button by their profile, and select either Online or Offline (to remove themselves from chat).
Useful Links for Embedding HTML code on your Webstore
You can edit your Live Chat widgets at any time by going to Chat and clicking on the widget that you would like to edit. To add Live Chat to another channel, simply follow the same steps.
Got questions about setting up Xsellco Live Chat? We’ll be happy to answer any questions you might have. Contact us at firstname.lastname@example.org.