- Create a Crisp Account
- Create a new website, copy the website ID and add it in your
.env.localfile.
- Add the following import in your
apps/web/app/app/layout.tsxfile:
- Add the following line in your
apps/web/app/app/layout.tsxfile:
Documentation Index
Fetch the complete documentation index at: /llms.txt
Use this file to discover all available pages before exploring further.
At the end of this tutorial, you’ll have a nice chat widget to support your customers.
.env.local file.CRISP_CHAT_ID={{YOUR_CRISP_CHAT_ID}}
apps/web/app/app/layout.tsx file:import { SupportChat } from '@/components/support/chat-widget'
apps/web/app/app/layout.tsx file:export default function RootLayout({
children,
}: {
children: React.ReactNode;
}): JSX.Element {
return (
<html lang="en">
<body className={poppins.className}>
<Toaster
toastOptions={{
unstyled: true,
classNames: {
error: 'text-danger',
success: 'text-primary',
info: 'text-primary',
warning: 'text-primary'
}
}}
/>
{children}
<SupportChart /> {/* <- Add this line */}
</body>
</html>
);
}