Chat buttons can be created by adding predefined class names to your html content. This method is suitable for most cases. Use the following classes to create chat related content.
Note 1: you can define multiple chat buttons on a single page / template.
Note 2: cb_online and cb_offline elements will be toggled as block elements (not inline). Please choose elements such as DIV.
| Class name | Behaviour |
| cb_online | Optional. content is visible when an agent is available, hidden when not. |
| cb_offline | Optional. content is visible when no agent is available, hidden when there is. |
| cb_chatbutton | Optional. assigns an onclick event to the element which opens a chat conversation. Must be placed within a cb_online container. |
| cb_declined | Optional. content is visible when the visitor has declined a proactive invite |
| cb_accepted | Optional. content is visible during an active conversation |
Example 1: use an image as chat button
<div class="cb_online" style="display: none;"> <a href="#startchat" class="cb_chatbutton"><img src="path_to_your_image.gif"/></a> </div>
Example 2: use a normal text link as chat button
<div class="cb_online" style="display: none;"> <p>We are online. </p> <a href="#startchat" class="cb_chatbutton">Start Chat</a> </div>
Example 3: We are offline
<div class="cb_offline"> We are currently not available. Please call us. </div>
Comments
0 comments
Article is closed for comments.