Live Chat System
The Gately Live Chat system provides real-time chat functionality with AI agent integration, file uploads, and customizable widgets that automatically deploy to your Framer sites.Real-Time Messaging
Instant communication with WebSocket connections for seamless conversations
AI Agent Integration
Smart responses powered by advanced AI with learning capabilities
File Upload Support
Share images, documents, and media with built-in validation
Zero-Code Deployment
Automatically appears on your Framer site when created in Gately app
Quick Start
Create Chat Widget
Navigate to your Gately dashboard and create a new live chat widget. Configure the appearance, position, and behavior settings to match your brand.
Configure AI Agent
Set up your AI support agent with custom responses, knowledge base, and escalation rules for seamless customer support.
Set Business Hours
Define your availability schedule with timezone support to manage customer expectations and offline messaging.
Auto-Deploy to Framer
Your chat widget automatically appears on your Framer site - no code injection or manual setup required.
The Gately SDK automatically handles all technical implementation. Simply create your widget in the dashboard and it will appear on your Framer site instantly.
Chat Widget Configuration
- Appearance Options
- Behavior Settings
- AI Configuration
- File Upload Settings
Position
Choose from bottom-right, bottom-left, top-right, or top-left placement
Theme
Select light, dark, or auto-switching theme based on user preference
Colors
Customize primary and secondary colors to match your brand identity
Avatar Display
Show or hide agent avatars and timestamps in conversations
Widget Icon System Migration
We’ve migrated our widget icon system from Lucide Icons to Phosphor Icons to provide you with more customization options.Phosphor Icons Integration
We now use Phosphor Icons for our widget and close icons.
6 Icon Style Options
You can choose from 6 different icon styles: Regular, Bold, Duotone, Fill, Light, and Thin.
PhosphorIconPicker Component
We’ve also added a newPhosphorIconPicker component with style selection to make it easy to choose an icon for your widget.
Backward Compatibility
For backward compatibility, the frontend includes fallbacks for existing widget configurations.Breaking Change
The widget icon configuration format has changed from a string to an object. Before:Ticket Management
Automatic Creation
Every chat conversation automatically becomes a support ticket with unique tracking
Smart Categorization
AI automatically categorizes tickets based on conversation content and context
Priority Assignment
Automatic priority setting based on keywords, urgency indicators, and customer tier
Status Tracking
Real-time updates on ticket progress from creation to resolution
Message Management
- Real-Time Messaging
- Message Types
- File Attachments
Instant Delivery
Messages are delivered instantly using WebSocket connections for real-time communication
Message History
Complete conversation history is preserved and accessible across sessions
Typing Indicators
Real-time typing status shows when agents or customers are composing messages
Read Receipts
Automatic read status tracking for all messages in conversations
Real-Time Chat Features
WebSocket Connection
Persistent connection ensures instant message delivery and real-time updates
Auto-Reconnection
Automatic reconnection handling ensures uninterrupted chat experience
Session Management
Smart session handling preserves context across page refreshes and navigation
Chat Events & Notifications
Chat Widget Controls
Open/Close
Programmatically control chat widget visibility and state
Minimize/Maximize
Toggle between minimized and full chat interface modes
Auto-Behavior
Configure automatic opening, closing, and interaction behaviors
File Upload Features
Drag & Drop Interface
Customers can easily share files by dragging them directly into the chat window
Automatic Validation
Files are automatically validated for type, size, and security before upload
Multiple Formats
Support for images, PDFs, documents, and other common file types
Secure Storage
All uploaded files are stored securely with proper access controls
AI Agent Integration
- Smart Responses
- Configuration
Instant Answers
AI provides immediate responses to common customer questions
Context Awareness
AI understands conversation context for more relevant responses
Learning Capability
AI improves responses based on customer feedback and interactions
Seamless Handoff
Smooth transition to human agents when AI cannot help
Business Hours Management
Timezone Support
Configure your business timezone for accurate availability display
Daily Schedules
Set different hours for each day of the week
Offline Messaging
Customers can leave messages when you’re unavailable
Auto-Responses
Automatic replies during off-hours with expected response times
Implementation Examples
- Basic Setup
- AI-Enhanced Chat
- File Upload Setup
- Business Hours
Create Widget
In your Gately dashboard, navigate to Widgets and create a new Live Chat widget
Configure Appearance
Set position to bottom-right, choose light theme, and customize colors to match your brand
Set Welcome Message
Add a friendly greeting like “Hello! How can we help you today?”
Auto-Deploy
Save your widget and it automatically appears on your Framer site
Data Management
Automatic Storage
All chat conversations and tickets are automatically stored and organized
Message History
Complete conversation history is preserved and searchable
Customer Profiles
Automatic customer information capture and profile building
Analytics Tracking
Comprehensive data collection for performance and satisfaction metrics
Project Configuration
Enable Live Chat
Navigate to your Gately project settings and enable the live chat feature
Configure AI Agent
Set up your AI support agent with custom personality, knowledge base, and response style
Set Response Times
Define maximum response times and fallback messages for optimal customer experience
Activate Widget
Your live chat widget is now ready and will automatically appear on your Framer site
Best Practices
Widget Placement
Position your chat widget in the bottom-right corner for maximum visibility and accessibility
Welcome Messages
Create friendly, informative welcome messages that set clear expectations for response times
Business Hours
Configure accurate business hours with timezone support to manage customer expectations
AI Training
Regularly update your AI knowledge base with new information and common customer questions
File Upload Limits
Set reasonable file size limits and validate uploads to ensure smooth performance
Brand Consistency
Customize colors, themes, and messaging to match your brand identity and voice
Response Times
Set and communicate clear response time expectations based on your team’s availability
Mobile Optimization
Test chat functionality across all devices to ensure responsive design and usability
The Gately SDK automatically handles technical best practices like error handling, reconnection, and resource cleanup, so you can focus on optimizing the customer experience.
Troubleshooting
Getting Help
Documentation
Browse our comprehensive guides and tutorials for detailed setup instructions
Community Support
Join our community forum to get help from other Gately users and experts
Direct Support
Contact our support team directly at support@usegately.com for personalized assistance
Most issues are resolved by ensuring your widget is active, properly configured, and that your Framer site has the latest Gately SDK integration.