Web Chat

Embed chat in your website to allow users to ask for help where they need it

Web Chat is only accessible to Parent Accounts with Product Edition set as Internal Helpdesk or External External Helpdesk.

🛠️ Setting Up Web Chat

• Navigate to the Settings > Chat Setup on ClearFeed WebApp.

• Enable the Chat Widget by clicking on the toggle.

• Click on Setup Instructions to see the changes needed to be done to add Chat widget to your Website.

Customizing Web-Chat Widget

You can customize the appearance and behavior of your web-chat widget by adding the below config object in the initialization script (that you will get through Setup Instructions as explained above). This allows you to create multiple web-chat instances across different pages with customized settings:

config: {
brand_color: '#HEXCODE',           // Updates major UI elements like background, icons, input fields, and attachments.
icon_logo_source: 'svg/link',      // Use a direct SVG or a link to your logo.
icon_logo_color: '#HEXCODE' or 'color-name', // Sets color for the default logo, text, and close (X) icon on the web-chat button.
icon_type: "horizontal",           // Options: "horizontal" | "round"
icon_size: "medium",               // Options: "small" | "medium" | "large"
position: "right",                 // Options: "left" | "right"
allow_dragging: true,              // Enables users to drag and reposition the web chat widget.
icon_text: "Help",                 // Label shown next to the icon (applies only for "horizontal" icon_type).
offset: {
    x: 40,                           // Horizontal offset (in pixels) from the left or right edge based on position. Optional (default: 40).
    y: 40                            // Vertical offset (in pixels) from the bottom of the screen. Optional (default: 40).
  }
};

Configuration Options:

• brand_color: Specify a hexcode to customize UI elements including backgrounds, icons, input fields, and attachments.

• icon_logo_source: Insert either a direct SVG or a URL to your logo.

• icon_logo_color: Define the color for the default logo icon and button text using a hexcode or color name.

• icon_type: Select "horizontal" (displays both text and icon) or "round" (shows icon only).

• icon_size: Choose "small," "medium," or "large" to set widget dimensions.

• position: Determine whether the widget appears on the "left" or "right" side of the screen.

• icon_text: Add custom text beside the icon (only available with "horizontal" icon_type).

• offset: Adjust widget placement with specific pixel measurements from screen edges.

• allow_dragging: Enable users to reposition the chat widget when set to true (defaults to false if unspecified). Dragging on desktop is limited to prevent the widget from moving off-screen.

Note: Web-chat configuration must be done manually within the script. There is no UI for changing these settings.

How ClearFeed WebChat identifies users

Logged-In Users​

When a user is logged into your website and accesses Web Chat, we recommend passing their identifying information—such as user.name, user.email, and user.hash— at the time of initialization. This allows ClearFeed to:

• Deliver a personalized support experience across devices and browsers

• Ensure that the users' past conversations are available to them when they log in again

Note: User information being passed during Initialization should be non-empty

Anonymous Users

An anonymous user is one who accesses Web Chat without being authenticated on your website. If no user information is provided during initialization, ClearFeed treats the visitor as an anonymous user. When an anonymous user starts a chat, ClearFeed prompts them to enter their Name and Email Address—both required fields—before initiating the conversation.

This helps ensure that even anonymous users can have a consistent support experience and makes it easier for agents to follow up if needed.

Chat Collection

A standard Collection "Web Chat" is automatically created as soon as you enable "Chat Widget" for your account. This collection will store all the chat tickets.

Below configurations can be done for Chat Collection:

• Responder Settings – Define who from your organization should be treated as support agents/members in ClearFeed.
• Triage Channel – Configure the channel for the support team to work from on Slack to handle incoming support requests.
• Assignment Rules – Define how requests or tickets are assigned, supporting round-robin or rule-based assignment.
• Ticketing - Select your integration and choose the trigger mode for ticket creation. Trigger mode for the ticket can be an emoji (e.g.. 🎟️) applied to the thread or tickets can be auto-created on every new message on the request channel.
• GPT-Powered Answers - Enable AI-driven responses for common queries.
• Automations – Set up workflow automation based on triggers like request creation, status changes, or SLA breaches.
• Business Schedules & SLA - Define working hours to ensure SLAs are calculated accurately & Configure service level agreements (SLAs) for response and resolution times.
• Additional Collection Settings - Download request data and customize message classification settings.