# Next.js boilerplate with Crisp

> The Crisp chat widget, loaded through next/script at idle and behind a consent gate. A typed wrapper covers the `$crisp` command queue. Identification is HMAC-verified and read from the shared `@/lib/auth/session` surface. Route-based hiding keeps it off your marketing hero.

Live chat and a shared inbox from one script tag, kept off your critical path.

- **Category:** Support
- **Pricing:** Free plan with 2 seats and the chat widget. Mini is $45/month with 4 seats, Essentials $95/month with 10 and Plus $295/month with 20. Each extra seat on a paid plan is $10/month.
- **Best for:** Small teams who need a real support inbox this week and do not want to run one. Chat and email land in one shared inbox, with a mobile app. Setup is one website id in an env var.
- **Requires:** auth
- **Vendor docs:** https://docs.crisp.chat/guides/chatbox-sdks/web-sdk/dollar-crisp/

## Trade-offs

- It is a third-party script on your pages, plus a websocket. Loaded at idle it stays out of your metrics. Loaded eagerly it shows up in LCP and INP.
- The API is a command queue, not an SDK. `$crisp.push(["do", "chat:open"])` is stringly typed and fails silently on a typo, which is why this battery wraps every call it uses.
- Verified identification needs an auth battery, so selecting Crisp pulls one in. `src/lib/support/identity.ts` reads `getSessionUser()` from `@/lib/auth/session`, never an auth SDK, so which one you pick makes no difference here.
- Cookies and a session id are set the moment the script runs. Where consent is required, the widget cannot load before the user agrees. The gate is not optional, and adding it later means auditing what already shipped.
- Routing, tagging and automation are simpler than in Intercom or Zendesk. Fine for a team of three. A support org of thirty will outgrow them.
- Email identification is only trustworthy with HMAC verification on. Without it, anyone can set any email in the chat and pose as a customer to your support team.

## Known fixes it ships

- [Consent gating a chat widget without breaking it](https://agenticboilerplate.com/cookbook/crisp/gdpr-consent-gating): Chat sets cookies before anyone types a word, so hiding the launcher is not compliance. Gate the script tag itself, make withdrawal real, and know why a reload is the only honest teardown.
- [Keeping the chat bubble off the pages that need a clean hero](https://agenticboilerplate.com/cookbook/crisp/hiding-the-widget-on-marketing-pages): hide and show are visibility commands, not load control. Gate the script by route, hide on navigation, and give marketing pages a trigger you designed instead.
- [Identifying signed-in users in chat without letting anyone impersonate them](https://agenticboilerplate.com/cookbook/crisp/identifying-signed-in-users-safely): An email set from the browser is a claim anyone can make. Sign it server-side with HMAC, pass the signature through, and give your support team a label they can act on.
- [Loading a chat widget without wrecking your Core Web Vitals](https://agenticboilerplate.com/cookbook/crisp/loading-chat-without-hurting-lcp): The vendor snippet is a synchronous script in the head. Move it to next/script with lazyOnload, measure the difference, and keep the click working while it downloads.
- [Routing support conversations with segments and session data](https://agenticboilerplate.com/cookbook/crisp/routing-conversations-with-segments): A shared inbox where everything looks the same is a queue, not a support system. Segments route, session data answers the first three questions, and both belong in code.

## Generate it

[Build a repo with Crisp](https://agenticboilerplate.com/build?b=crisp)

---

Agentic Boilerplate: A Next.js repo your agent already knows. Free during launch, then $99 once.

- Site map for agents: https://agenticboilerplate.com/llms.txt
- Public API: https://agenticboilerplate.com/openapi.json
- Contact: agenticstudio@gmail.com