Service Cloud Chat Developer Guide

About This Guide
Prerequisites
API Versions
Customize Deployments with the Deployment APIs
Use Pre-Chat to Gather Visitor Information and Set Context for the Agent
Implement a Custom Chat Window Using Visualforce
Chat Visualforce Components
Chat Visualforce Components Code Sample
Use Post-Chat to Wrap Up the Chat Interaction with Your Customer
Set Up Direct-to-Agent Chat Routing with the Deployment APIs
PDF

Newer Version Available

This content describes an older version of this product. View Latest

Implement a Custom Chat Window Using Visualforce

Chat windows are what visitors use to exchange messages with support agents. Each of your Chat deployments includes a chat window. You can create a customized chat window by using Visualforce, and you can add styling and functionality with HTML, CSS, and JavaScript.

The legacy chat product is in maintenance-only mode, and we won't continue to build new features. You can continue to use it, but we no longer recommend that you implement new chat channels. Instead, you can modernize your customer communication with Messaging for In-App and Web. Messaging offers many of the chat features that you love plus asynchronous conversations that can be picked back up at any time.

Important

Einstein Bots doesn’t support menus and quick replies in custom Chat windows. To learn more about Einstein Bots Chat channel specifications, see Deploy Your Bot to Channels.

Avoid linking to Salesforce CSS stylesheets when you customize your chat window. They aren’t versioned and can change without notice. Instead, we recommend that you use Visualforce components that mimic Salesforce styles instead of directly referencing the stylesheets. That way, you’re always in control of how your chat window looks. See Using Styles from Salesforce Stylesheets to lean how to disable our stylesheets.

For more information on using Visualforce, see the Visualforce Developer Guide.