Contact tab
Intro
This card gives an overview of the contact tab template, explaining what the different fields do.
Product
- Mobile Service Cloud
Resolution
Contact tab template
TEMPLATE NAME:
As you might expect, the name of the service hours template, this will be shown in the dropdown menu for selecting a template in the web store settings.
Choose the color and position
Desktop:
Options displayed in this column will determine the settings desktop. If 'Show different on mobile' has not been selected, this will determine settings for the contact tab on all devices.
Show different on mobile:
By enabling this option the different settings can be set separately for mobile devices, this can help prevent the contact tab being place in front of important elements on the client's website.
Tab style:
Determines the main button type.
Single tab: a simple single button, pinned to the border of the browser window. Directly opens the widget when clicked.
Channel tab: a simple single button, pinned to the border of the browser window. Opens a menu to select a preferred channel.
Floating tab: a simple single button, floating a small distance from the border of the browser window. Directly opens the widget when clicked.
Theme:
Determines the color of the contact tab.
Dark: a dark gray color rgb(51, 51, 51)
Light: a light gray color rgb(239, 239, 239)
Blue: a light blue color rgb(42, 134, 225)
Grey: a mid tone gray rgb(118, 134, 147)
Red: a beautiful ROBIN red color rgb(198, 48, 48)
Position:
Determines the position of the contact tab relative to the browser window.
Left: pins the tab to the left border of the browser window.
❗bottom left for floating tab.
Right: pins the tab to the right border of the browser window.
❗bottom right for floating tab.
Bottom left: displays the tab near/pinned to the bottom left border.
Bottom right: displays the tab near/pinned to the bottom right border.
Hidden: doesn't display the tab
Text offline tab:
Determines the text shown in the contact tab when no agents have an online presence.
Text online tab:
Determines the text shown in the contact tab when one/more agents has/have an online presence.
Personal avatar:
Determines whether the avatar should be displayed in the contact tab.
Channel selectors:
❗ONLY APPLICABLE TO THE CHANNEL TAB
Header text: the text displayed at the very top of the menu.
Contact form: the text displayed for the contact form option.
Chat: the text displayed for the chat option.
Offline: the text displayed for the chat option when no agent has an online presence.
Phone: the text displayed for the phone option.
Tab width: the width of the tab in pixels (standard: 200).
How to setup contact tab template
Goal
You know how to setup the contact tab template in the Mobile Service Cloud.
Who can it help?
- Techy
- Administrator
- Manager
How to setup contact tab template
Within the templates settings of the Mobile Service Cloud you have the option to configurate different contact tab templates. You can access the contact tab templates via Settings > Templates > Contact tab. A contact tab template allows you to adjust the styling and text of the button you can implement on your website.
Name the template so you can easily find it when selecting a contac tab template in the webstore settings. For example: use different country abbreviations like EN, DE, UK etc.
Please check with someone from IT our your website administrator if you have a custom designed tab. If you have a customised tab we advise you to reach out with the one who manages your website. Changing the settings could conflict with the customisation and may cause a disfunctional tab.
Tab styles
You can choose between different tab styles. The floating tab is the tab which is used the most.
- Single tab
- Channel tab
- Floating tab
Single tab
The single tab is a tab which which will be attached to the border of your browser window and can be positioned on multiple locations.
The single tab will open the live chat window or contactform based on whether there is live chat presence.
EXAMPLE SINGLE TAB
Channel tab
The channel tab has the same positioning options as the single tab but when you click on it a channel selector will slide out and will give the website visitor the option to choose between the current contact options. The available channels are contactform, live chat (if there's currently live chat presence) and phone.
EXAMPLE CHANNEL TAB
Floating tab
The most used tab style. Unlike the single and channel tab it doesn't stick to the border of the window of the browser but can float in the bottom left and right corner. The floating tab opens the live chat windows or contactform option based on where there is live chat presence. Just like the single tab.
EXAMPLE FLOATING TAB
Theme
The Mobile Service Cloud has several default themes which you can use to adjust the colors used in the tab.
- Light
- Dark
- Blue
- Grey
- Red
Text offline tab
When you're available by contactform the offline text will be displayed and can be configurated in the text offline field. Commonly used options are:
- Contact
- Email us
- Help
Text online tab
When you're available for live chat the online text will be displayed in the tab and can be configurated in the text online field. Commonly used options are:
- Live chat
- Start a chat
- Chat with $User_Firstname (can only be used if you offer personal live chat)
Personal avatar
You have the option to show the profile picture of the user which is available for live chat in the tab on your website. The usage of this personal avatar in the tab is only available if you choose the floating tab.
