> ## Documentation Index
> Fetch the complete documentation index at: https://docs.turbostack.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Customer support with Crisp

> At the end of this tutorial, you'll have a nice chat widget to support your customers.

TurboStack uses Crisp to handle customer support and feedbacks. This is an easy setup and you can achieve it in four simple steps:

1. Create a [Crisp Account](https://app.crisp.chat/initiate/signup/?locale=en)
2. Create a new website, copy the website ID and add it in your `.env.local` file.

```bash theme={null}
CRISP_CHAT_ID={{YOUR_CRISP_CHAT_ID}}
```

3. Add the following import in your `apps/web/app/app/layout.tsx` file:

```ts theme={null}
import { SupportChat } from '@/components/support/chat-widget'
```

4. Add the following line in your `apps/web/app/app/layout.tsx` file:

```tsx theme={null}
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>
  );
}

```
