Installing on websites & CMS
How to Install Crisp Live Chat Software on a Custom Website
This article explains how to install the Crisp Live Chat widget on a custom website. The easiest way to add Crisp to a custom website is to copy your Crisp chatbox script and paste it into your website HTML. If your website runs on a CMS, ecommerce platform, or JavaScript framework, you can use a dedicated guide instead. This guide is split into practical steps: Before you start → what you need before installing Crisp [Watch the installation walkthrough](#1-watPopularHow to Install the Crisp Live Chat Plugin on Wordpress
This article explains how to install Crisp Live Chat on a WordPress website. The Crisp WordPress plugin lets you add the chatbox without editing your theme manually. Install the plugin from WordPress, link it to your Crisp workspace, and the chatbox can start loading on your public pages. This guide is split into practical steps: Before you start → what you need before installingPopularHow to add a chat widget to your Webflow website
This article explains how to add the Crisp chatbox to a Webflow website. You can install Crisp chat widget software on Webflow by copying your Crisp chatbox script and pasting it into your Webflow project custom code, then publishing your site. Webflow custom code requires an active Site plan or an eligible Workspace plan. If the Custom Code section is unavailable, check your Webflow plan first. ${color}[#0080dd](Copy your Crisp chatbox scriSome readersHow to install the Crisp live-chat chatbox on Wix
This article explains how to add the Crisp chatbox to a Wix website. Wix lets you add third-party scripts from your site's Custom Code settings. Once your Crisp script is added and applied to your pages, the chatbox can load on your published site. Wix custom code requires a published site with a connected domain. If your Wix site does not meet this requirement, the Crisp script cannot be added through this method. Add a live chat to Wix ${color}[#00Few readersHow to install the Crisp live-chat chatbox on Squarespace
This article explains how to add Crisp Live Chat to a Squarespace website. Squarespace lets you add custom scripts through Code Injection on supported plans. Once your Crisp chatbox script is pasted there, the widget can load across your Squarespace site. Code Injection availability depends on your Squarespace plan. If you do not see the option, check your Squarespace billing plan or use a supported custom-code option. Retrieve your Crisp chatbox script StartFew readersHow to install the Crisp live chat software on Joomla?
This article explains how to add Crisp Live Chat to a Joomla website. The Crisp Joomla extension lets you install the chatbox from your Joomla administrator panel and link it to your Crisp workspace without manually editing your website code. The Joomla extension is an older integration. Before using it in production, check the current compatibility details on the Joomla Extension Directory, especially if your site uses a recentFew readersHow to add the chat software on Bubble
This article explains how to add the Crisp chatbox to a Bubble app. Bubble does not require you to edit your app code directly. You can install Crisp support chat plugin through a community Bubble plugin, then connect it to your Crisp workspace with your Website ID. The Bubble integration mentioned here is a community plugin, not a plugin built by Crisp. Review the plugin page and test it on your Bubble app before relying on itFew readersHow to install the Crisp live-chat chatbox on Weweb.io
This article explains how to add the Crisp chatbox to a WeWeb website. WeWeb lets you add custom code to your project, which makes it possible to load the Crisp chatbox on your published website. What is WeWeb? WeWeb is a no-code front-end builder for creating web applications and websites. It includes a visual editor and supports integrations with external services and custom code. 
Learn how to embed the Crisp chatbox in a single-page app using the official Web SDK package. The crisp-sdk-web package is the recommended option for React, Vue, Angular, Nuxt, Next.js, and other single-page applications. It wraps the $crisp chat SDK and provides TypeScript-friendly helpers for common chat widget actions. Install the Web SDK Install the package from your application project. npm installFew readers
Managing visibility & access
How to hide the chatbox on specific page urls
This article explains how to hide the Crisp chatbox on selected pages of your website. Page restrictions are useful when the chatbox should not appear on specific areas, such as checkout, legal pages, internal tools, or pages where another contact flow is already used. Hide the chatbox on blocked pages Blocked pages work as a denylist. The chatbox remains visible elsewhere, but is hidden on the URLs you add to the list. To hide the chatbox on selected pages: 1Some readersHow to block the chatbox for specific IPs
This article explains how to block the Crisp chatbox for specific IP addresses. IP restrictions help prevent selected visitors or networks from accessing the chatbox. Crisp supports IPv4, IPv6, and CIDR notation for broader network rules. Block specific IP addresses You can add blocked IP rules from the chatbox restrictions settings. To block an IP address: Go to Crisp Open **Settings → Chatbox Settings → Chatbox RestrictionFew readersHow to temporary hide the chatbox with the vacation mode
This article explains how to temporarily hide the Crisp chatbox from your website. Vacation mode is useful when your team needs to pause live chat for a short period, such as holidays, maintenance, or temporary staffing changes. Once enabled, the chatbox is hidden everywhere it is installed until you turn the option off again. Enable vacation mode Vacation mode hides the chatbox across your website in one click. To temporarily hide the chatbox: Go to [**CriFew readersHow to hide the chatbox on mobile devices
This article explains how to hide the Crisp chatbox on mobile devices. Hiding the chatbox on mobile can be useful when your mobile layout is very compact, or when you only want to offer live chat from desktop pages. Hide the chatbox on mobile The mobile visibility option is managed from the chatbox behavior settings. To hide the chatbox on mobile devices: Go to Crisp Open Settings → Chatbox Settings → Chatbox BehaviorFew readersDoes the Crisp widget display ads
Learn whether Crisp displays ads inside the chatbox installed on your website. Crisp will not show ads on your website or inside your chatbox. The chatbox may display Crisp branding depending on your plan, but that branding is not advertising and can be removed when your workspace uses an eligible white-label plan. No ads in the Crisp chatbox Crisp does not inject third-party ads, banners, sponsored links, or promotional content into your website through the chatboFew readers
Customizing appearance
How to customize the Crisp Chatbox
This article explains where to customize the Crisp chatbox and which settings are available. Crisp lets you adapt the chatbox to your brand by adjusting its colors, texts, behavior, position, and localized wording. Advanced customization now lives directly inside the chatbox settings, instead of in a separate Customization plugin. Watch the chatbox customization walkthrough If you prefer a quick visual walkthrough, this video shows how to customize your Crisp chatbPopularHow to change to chatbox position to the left
This article explains how to move the Crisp chatbox from the right side to the left side of your website. By default, the Crisp chatbox is displayed on the right side of the page. You can reverse its position from the chatbox appearance settings when the left side fits your website layout better. Watch the chatbox customization walkthrough If you prefer a quick visual walkthrough, this video shows how to customize your Crisp chatbox, from basic appearance settingsSome readersHow to remove the "We run on Crisp" branding links
This article explains how Crisp branding is removed from the chatbox and email conversations. By default, Crisp shows We run on Crisp branding in the chatbox and in emails sent to or from your visitors. White labelling removes this branding when your workspace is on a paid Plus plan. Required plan De-branding the Crisp chatbox and emails requires a paid Plus plan. White labelling is not removed during a trial, even if the Plus trial shows the feSome readers
Configuring messages & features
How to enable the "we are online" chatbox tooltip
This article explains what the availability tooltip is and how to show it in the Crisp chatbox. The availability tooltip is the small popup shown when the chatbox is closed and your team is available. It helps visitors notice that your team is online and ready to help, without opening the chatbox for them. What the availability tooltip does When your support is online, Crisp can display a short tooltip near the minimized chatbox. Depending on your setup, it can shoSome readersHow to display channels contact information in the chatbox
Learn how to display alternative contact channels such as email, phone, WhatsApp, Instagram, Telegram, Messenger, and X in Crisp. Contact information gives customers another way to reach your team when live chat is not enough. Some details can appear in emails sent by Crisp, while the full list can be shown from the Crisp Chatbox. What contact channels can display You can configure several contact channels from your workspace settings. __Available contact channelsFew readersHow to change the chatbox language
This article explains how to control the language displayed in the Crisp chatbox. By default, Crisp detects the visitor browser language and displays the best supported chatbox locale automatically. You can also force one language for every visitor, or handle language selection programmatically when your website is multilingual. Watch the chatbox customization walkthrough If you prefer a quick visual walkthrough, this video shows how to customize your Crisp chatboxPopularHow to display the homepage in the Crisp chatbox
This article explains how to enable the Home section in the Crisp chatbox widget. The Home section gives visitors a clearer starting point when they open the widget. It can group key actions such as starting a conversation, searching your knowledge base, checking updates, or viewing your status information. What the Home section is The Home section is a dedicated entry screen inside the chatbox. Instead of sending visitors directly into a conversation, you can giveFew readersHow to change the chatbox welcome message
This article explains how to change the welcome message shown in your Crisp chatbox. The welcome message is the first greeting visitors see when they open the chatbox. A clear and friendly message can encourage visitors to ask their question and understand what kind of help they can expect. Changing the welcome message only changes the text displayed in the chatbox. It does not change how the widget itself loads on your website. ${color}[#0080dd](Watch the chatbox customization waPopularHow to use MagicBrowse for Co-Browsing with Crisp
Learn how to exclude sensitive page elements from MagicBrowse tracking. MagicBrowse is designed with privacy in mind and automatically hides form inputs. If your page displays sensitive information outside standard inputs, you can add an HTML attribute to prevent those elements from being tracked. Exclude an HTML element Add the data-browsing-ignore attribute to any element that should be ignored by MagicBrowse. Before excluding the sensitive value: <htFew readersHow to prevent users from seeing when an agent os composing or read a message
This article explains how to enable operator privacy mode in the Crisp chatbox. Operator privacy mode hides read markers and typing animations from visitors. This can be useful when your team wants to read or prepare replies without showing those activity signals in the chatbox. What operator privacy mode hides When a visitor sends a message, the chatbox can normally show that an operator has read it. It can also show a typing animation while an operator is composiFew readersGetting started with the Crisp Overlay (AI Search)
Learn how to enable and customize Crisp Search Chatbox AI from your Crisp Chatbox. Crisp Search Chatbox AI adds an AI-powered search layer before visitors reach your team. It helps customers find quick answers from your AI data sources, while still giving them a way to contact support when they cannot find what they need. What Crisp Search Chatbox AI does Crisp Search Chatbox AI is a self-service search widget that runs from the Crisp Chatbox. Instead of openinFew readersHow to enable the Crispy Bird game
This article explains how to enable Crispy Bird, the waiting game shown in the Crisp chatbox. Crispy Bird gives visitors something playful to do while they wait for a reply. It can make slower response moments feel a little lighter without changing how conversations are handled. What Crispy Bird is Crispy Bird is a small game that can be suggested to visitors when operators are slow to reply. ![Crispy Bird game in the chatbox](https://storage.crisp.chat/users/helpFew readers
Sharing & embedding the widget
How to Embed the Crisp Live Chat Chatbox in an iFrame
This article explains how to embed the Crisp Live Chat widget inside an iFrame. The standard Crisp installation displays the chatbox as a floating widget on your website. An iFrame lets you place the chatbox inside a specific page, panel, dashboard, or external platform while controlling the space it occupies. You can embed Crisp using either the direct external chatbox link or a custom HTML page configured with the Crisp JavaScript SDK. Learn more about the [Crisp Live Chat widget](httpPopularHow to Install the Crisp Live Chat Widget to a Notion Page
This article explains how to embed the Crisp Live Chat chatbox inside a Notion page without using code or installing a plugin. Notion can display external URLs directly inside a page. To add Crisp, find your Website ID, generate the direct link to your chatbox, then paste it into a Notion Embed block. If Hugo AI Agent is activated on your workspace, visitors can also interact with your AI Agent directly from the embedded chatbox. _Some readersHow to Create and Customize a Direct Link to your Crisp Chatbox
This article explains how to generate, customize, and share a direct external link to your Crisp chatbox. A direct chatbox link lets visitors open your Crisp live chat widget without first visiting a website where Crisp is installed. You can share this link directly, add it to a button or contact page, embed it inside another platform, or use it to test your chatbox. Messages sent from the link reach the Crisp workspace connected to its Website ID. If HugoFew readers
Troubleshooting the widget
This section contains no articles.
How to troubleshoot chatbox visibility issues
Troubleshoot the most common reasons the Crisp chatbox does not appear or work correctly on your website. When the chatbox is missing, the cause is usually the installation code, browser compatibility, cached assets, a JavaScript conflict, a security rule, or a Crisp setting that hides the widget. Start with the checks below before investigating deeper network issues. Check the chatbox installation code First, confirm that the Crisp script is present on the page whPopularHow to automatically hide the chatbox when all agents are offline
This article explains how to hide the Crisp chatbox when all operators are away. This option is useful when you only want visitors to see the chatbox while your team is available. When everyone is away, the widget is hidden from your website until support becomes available again. Hide the chatbox when support is away Crisp can automatically hide the chatbox when all operators in your workspace are away. To enable this behavior: Go to [Crisp](https://appFew readersHow to troubleshoot "Invalid website" errors in the chatbox
Fix “invalid chatbox code” or “Invalid Website” errors by checking your domain lock, installation code, and workspace state. These errors usually come from a mismatch between the installed chatbox code, the domain allowed to load it, and the Crisp workspace that owns the Website ID. Check the domain lock option Crisp includes a security option that locks the chatbox to your configured website domain and subdomains. If this option is enabled, other domains cannot loFew readersHow is Crisp optimised to not slow down your website's loading
Understand how the Crisp chatbox is optimized for website performance and what to check when automated tools report warnings. Crisp is built to load asynchronously and keep the chatbox lightweight. Automated performance tools can still report warnings because they do not always account for compression, caching, HTTP/2, delayed loading, and user experience context. How Crisp loads on your website The Crisp chatbox is designed to avoid blocking your main page contentFew readersHow to troubleshoot encoding issues in the chatbox
Fix broken accents, question marks, symbols, or incorrectly displayed characters in the Crisp chatbox by using UTF-8 encoding on your website. The Crisp chatbox supports international languages, accents, non-Latin alphabets, and emojis through UTF-8. Because the chatbox is injected into your website page, it can inherit the page encoding; if your website still uses a legacy charset, characters inside the chatbox may display incorrectly. The Crisp chatbox is compatible with **UTF-8 enFew readersHow does the Crisp chatbox handle high website traffic
Understand how the Crisp chatbox behaves on high-traffic websites and what changes when traffic reaches safety thresholds. The Crisp chatbox is designed to scale on busy websites. At high volume, Crisp can adjust some real-time behaviors to protect performance while keeping visitor messaging available. In this article: How high-traffic mode works → what changes for visitors and operators High-traffic thresholds → when CrFew readersHow to display the chatbox only on specific pages
This article explains how to show the Crisp chatbox only on selected pages of your website. This is useful when you want live chat on high-intent pages, such as pricing, checkout, or contact pages, while keeping it hidden everywhere else. Show the chatbox only on allowed pages The allowed pages list works as an allowlist. When it is configured, Crisp only appears on the URLs you add there. To allow the chatbox only on specific pages: Go to [Crisp](httpsFew readersHow to hide the chatbox for specific countries
This article explains how to hide the Crisp chatbox for visitors from specific countries. Country restrictions are useful when your team only supports certain markets, or when live chat should not be available in regions where you cannot provide service. Block countries from using the chatbox When a country is blocked, visitors detected from that country will not see the chatbox. To block one or more countries: Go to Crisp OFew readersHow to hide the estimated response time from the chatbox
This article explains how to hide or customize the average response time shown in the Crisp chatbox. Crisp can display activity metrics in the chatbox, such as the expected reply time, before your team replies to a visitor. You can hide this metric or replace the wording with a custom localized text. Hide the average response time The average response time is controlled by the activity metrics option in the chatbox appearance settings. ![Average response time showFew readersHow to change the chatbox color
This article explains how to change the main color theme of the Crisp chatbox. You can quickly choose a predefined color from the chatbox appearance settings. If you need custom brand colors, use the dedicated Customization settings. Watch the chatbox customization walkthrough If you prefer a quick visual walkthrough, this video shows how to customize your Crisp chatbox, from basic appearance settings to texts, position offsets, and custom colors. ${youtube}[HPopularHow to change the chatbox background
This article explains how to change the background pattern used in the Crisp chatbox. Background patterns are a simple way to make the widget feel closer to your brand while keeping the chatbox layout familiar for visitors. Change the chatbox background You can choose a background pattern from the chatbox appearance settings. To update the background pattern: Go to Crisp Open Settings → Chatbox → Appearance Find **ChaFew readers