F Freshdesk

How to set up chat widget on Freshdesk

beginner 8 min read Updated 2026-03-18
Quick Answer

Setting up a chat widget on Freshdesk involves enabling Freshchat from your admin panel, customizing the widget appearance, and adding the generated code to your website. The process takes about 10-15 minutes and requires admin permissions.

Try Freshdesk Full Freshdesk Review

Prerequisites

  • Active Freshdesk account with admin access
  • Website where you want to install the chat widget
  • Basic understanding of HTML/website editing

Step-by-Step Instructions

1

Access Freshchat Settings

Log into your Freshdesk account and navigate to Admin → Channels → Chat & Messaging. Click on Freshchat to access the chat widget settings.
If you don't see Freshchat option, ensure your Freshdesk plan includes chat functionality or upgrade your subscription.
2

Enable Chat Widget

In the Freshchat section, toggle the Enable Chat switch to activate the chat functionality. Click Configure to proceed with widget setup and customization options.
3

Customize Widget Appearance

Configure your chat widget by setting:
  • Widget theme and color scheme
  • Welcome message and offline message
  • Widget position (bottom-right, bottom-left, etc.)
  • Business hours and timezone
Click Save after making changes.
Choose colors that match your brand identity for a cohesive user experience.
4

Set Up Chat Routing

Navigate to Routing settings and configure:
  • Default agent assignment
  • Department-based routing
  • Business hours availability
Set up Auto-assignment rules to distribute chats efficiently among your team members.
Enable round-robin assignment to ensure equal chat distribution among available agents.
5

Generate Widget Code

Go to Widget Installation section and click Get Widget Code. Copy the generated JavaScript code snippet that looks like:
<script src="https://widget.freshworks.com/widgets/[your-widget-id].js"></script>
Keep this code secure and only install it on authorized websites.
6

Install Widget on Website

Paste the copied widget code into your website's HTML, preferably just before the closing </body> tag. If using a CMS like WordPress, add it to your theme's footer.php file or use a code injection plugin.
Test the widget on a staging site first before deploying to your live website.
7

Test Chat Functionality

Visit your website and verify the chat widget appears correctly. Test the chat flow by:
  • Sending a test message
  • Checking message delivery in Freshdesk
  • Verifying offline behavior
  • Testing on mobile devices
Use incognito/private browsing mode to test the widget as a new visitor would see it.

Common Issues & Troubleshooting

Chat widget not appearing on website

Verify the widget code is placed correctly before the </body> tag and check if any ad blockers or firewalls are blocking the Freshworks domain. Clear browser cache and check browser console for JavaScript errors.

Widget appears but messages not reaching Freshdesk

Check your Routing Settings and ensure at least one agent is assigned and available. Verify that business hours are configured correctly and the chat service is enabled in your Freshdesk admin panel.

Widget styling conflicts with website design

Use custom CSS to override widget styling or adjust the widget position in Appearance Settings. Add custom CSS rules with !important declarations to ensure they take precedence over default widget styles.

Chat widget loading slowly

Ensure the widget script is loaded asynchronously and placed at the bottom of your page. Check your website's loading speed and consider using a CDN. Contact Freshworks support if the issue persists across multiple websites.

Prices mentioned in this guide are pulled from current plan data and may change. Always verify on the official Freshdesk website before purchasing.
Visit Freshdesk View Freshdesk Pricing