You can customize your Live Chat window from your ServicersWeb portal at any time.
Below you’ll find descriptions of each setting in the Live Chat Module tab as well as step-by-step instructions for how to update each setting.
Use the table of contents to quickly scroll to specific sections of is article.
1. Access the Live Chat Module Settings #
#1: Log in to your ServicersWeb Portal here.
#2: Click on Message Portal > Settings
These options appear in the left sidebar as dropdowns.
#3: Click on Live Chat Module
This is the second to last top tab.
2. Customize Live Chat Color #
You can customize the color of your Live Chat window to match your branding.
Get an exact match by using an eyedropper browser extension like ColorPicker Eyedropper. Paste the color code into the custom color setting.
You ca see what a difference the correct colors make:
Preset Color 👎
Custom Color 👍
Here’s how to customize your Live Chat color:
#1: Log in to your ServicersWeb Client Portal and navigate to the Live Chat Module Tab.
Refer to TOC Section 1.
2. Click the color dropdown box.
This is the second option on the left.
3: Choose the color code you want to use.
You can also use the eyedropper tool to get an exact match of your website’s colors.
3. Hide Live Chat Icon on Mobile #
If you offer texting, we recommend that you make sure mobile users use that instead of Live Chat.
You can hide the Live Chat icon on mobile devices so that it doesn’t appear alongside the Call Now or Text buttons. This will make your mobile site less cluttered and more streamlined. When hidden on mobile, the Chat Icon will still appear on your desktop site.
You can see the difference here:
Chat Icon Not Hidden 👎
Chat Icon Hidden 👍
Hiding the chat icon for mobile devices is easy…
#1: Log in to your ServicersWeb Client Portal and navigate to the Live Chat Module Tab.
Refer to TOC Section 1.
#2: Check Hide on Mobile
This is a checkbox option to show and hide the chat icon on mobile. Check or uncheck this at any time.
4. Set Live Chat Header Icon #
The Header Icon appears at the top left of the Live Chat window when expanded. It’s best to use your company icon instead of your entire logo here since the space is small.
See the difference below:Full Logo 👎
Icon Only 👍
Here’s how to add or update your Live Chat icon:
#1: Log in to your ServicersWeb Client Portal and navigate to the Live Chat Module Tab.
Refer to TOC Section 1.
#2: Click Choose File beside Header Icon.
This is the third option on the left.
#3: Upload your icon file.
We recommend using a square PNG (transparent background) file that is about 300 x 300 px.
#4: Click the purple Save button.
This is located at the top right corner of your dashboard.
Need help with your icon graphic? We can help! Email us your request.
5. Set Header Main Title #
The Header Main Title appears in your Live Chat window beside your company icon. You can customize this text to say whatever you’d like.
#1: Log in to your ServicersWeb Client Portal and navigate to the Live Chat Module Tab.
Refer to TOC Section 1.
#2: Edit text in Header Main Title field.
This is the fourth option on the left of the dashboard. Insert the text you’d like to appear.
Examples:
- Let’s Chat!
- Have a Question?
- Chat Live with Us.
6. Set Intro Primary and Secondary Text #
The Intro Primary and Secondary text appears after a customer clicks on the chat bubble icon to begin a session.
Here’s how it appears to your website visitors:
To customize your Intro Primary & Secondary Text:
#1: Log in to your ServicersWeb Client Portal and navigate to the Live Chat Module Tab.
Refer to TOC Section 1.
#2: Edit text in Intro Primary & Secondary text fields.
The Primary Text will be the larger, top line of text the customer sees. The Secondary Text is the smaller, second line.
You can style the text just as you would in Word. You can even add links and emojis.
7. Set Welcome Text #
The welcome message appears as the initial message from your agent. You can customize this message to suit your needs.
Here’s how the welcome message appears to the customer:
How to customize your welcome message:
#1: Log in to your ServicersWeb Client Portal and navigate to the Live Chat Module Tab.
Refer to TOC Section 1.
#2: Edit the text in the Welcome Text field.
This is the last option on the left of your dashboard.
Examples:
- Thanks for contacting us. We’ll be with you shortly.
- An agent will be with you shortly. Thank you for your patience.
8. Set CSR Has Joined Text #
You won’t likely need to change this setting. It defaults to show the name of whichever CSR is handling the conversation.
Here’s what the customer sees:
If you’d like, you can change the name field to be generic:
#1: Log in to your ServicersWeb Client Portal and navigate to the Live Chat Module Tab.
Refer to TOC Section 1.
#2: Edit the CSR Joined Text field.
Examples:
- An Appliance Repair Biz agent has joined the conversation.
- {name} is ready to Live Chat.
9. End Conversation Text #
You can create a template for the end of each conversation in Live Chat. This makes it so that a CSR can simply click the End Conversation button when the chat is finished, and the customer will get a premade message.
This standardizes the language your CSRs use and leaves less room for less-than-desirable goodbyes.
Here’s what your customer would see:
Here’s how to customize your End Conversation Text:
#1: Log in to your ServicersWeb Client Portal and navigate to the Live Chat Module Tab.
Refer to TOC Section 1.
#2: Edit the End Conversation Text field.
You can customize this to suit your company’s protocol. You can even add a link that may be helpful to your customers, for example, a link to your blog or newsletter sign up.
10. Install Live Chat Script On Your Website #
Once you have your Live Chat settings configured and customized for your company, it’s time to activate it on your website!
#1: Log in to your ServicersWeb Client Portal and navigate to the Live Chat Module Tab.
Refer to TOC Section 1.
#2: Copy Code from the Script Box.
You’ll need to highlight and copy all the code that appears in the green box labeled “Script to Include on Your Website”.
#3: Paste the Code into Your Website
Make sure to paste all of the copied code before the header code in your website. If you’re unsure where to put it, we recommend having your web team do this part.
You’re all set! Start chatting with customers today!
11. Set Email Notifications for Offline Messages #
You can set your Portal up to email you or office staff when a person starts a live chat when you’re not logged in to the Portal. This way, you can get back to them at a later time, or log in to the Portal to respond.
Here’s how to set up email notifications:
#1: Log in to your ServicersWeb Client Portal and navigate to the Live Chat Module Tab.
Refer to TOC Section 1.
#2: Click Enable in the Email Notifications for Live Chat Section
This is the radio button in the Status section.
#3: Add users to receive email notifications
You can choose multiple users from the dropdown list under Who Receives the Notification to receive these emails.
*The recipient must be an active user to receive the notifications.
#4: Set a wait time before email is sent
Choose the amount of time you would like to wait before the email notification is sent. This is in the Minutes To Wait Before Notifying field. If no one gets online or replies to the Live Chat within this time frame, the email notification will be sent to the selected users.
*We recommend setting this to one minute.
12. Add Profile Pictures for Users #
Add a profile picture for each Message Portal User. This photo will show to customers on the front end of the Live Chat portal.
You can see here how a profile picture personalizes the conversation:
Without Photo 👎
With Photo 👍
It’s easy to add a profile picture for your Users:
#1: Log in to your ServicersWeb Client Portal and navigate to the Active Users Tab and click the Edit button.
#2: Upload a Photo
Choose a file to use as each User’s profile picture.
