How can I embed Crisp inside a single-page app?
Crisp provides a Web SDK that provides Typescript bindings for the Crisp chatbox.
This method is preferred when including Crisp in a single-page apps using Frameworks such as Angular, VueJS, React, NuxtJS or NextJS.
👉 The full Crisp Web SDK documentation is available on our Developer Hub.
npm install --save crisp-sdk-web
To add Crisp on your website, you will first need to create an account from the Crisp App.
Once you have your Crisp Website ID, you can then embbed Crisp in your app.
Deferring Crisp loading is possible, for instance, to display the chat after a login screen or custom button.
This method is preferred when including Crisp in a single-page apps using Frameworks such as Angular, VueJS, React, NuxtJS or NextJS.
Getting started
👉 The full Crisp Web SDK documentation is available on our Developer Hub.
Installation
npm install --save crisp-sdk-web
Basic Implementation
To add Crisp on your website, you will first need to create an account from the Crisp App.
Once you have your Crisp Website ID, you can then embbed Crisp in your app.
import { Crisp } from "crisp-sdk-web";
Crisp.configure(WEBSITE_ID);
// Crisp will be displayed
Manual loading
Deferring Crisp loading is possible, for instance, to display the chat after a login screen or custom button.
import { Crisp } from "crisp-sdk-web";
Crisp.configure(WEBSITE_ID, {
autoload: false
});
Crisp.load()
Updated on: 13/03/2024
Thank you!