Customer support

I currently have support for the following Customer Support tools:


Sign up for an account on Crisp and create a new website.

The tracking script for Facebook can be found in the @/lib/pixels/facebook.tsx file.

Environment variables

Once you've created a new website, head over to the website settings page and click on Settings for your website.

Go to Setup Instructions and copy the Website ID and add it to your environment variables.


Enable support widget

To enable the Crisp support widget, where customers can start a conversation with you, we need to import the crispChat component and add it within our SessionProvider provider.

Simply go to @/app/providers.tsx and add the following code:

// ...existing imports import dynamic from "next/dynamic"; import { FacebookPixelScript } from "@/lib/pixels/facebook"; export function Providers({ children }: { children: React.ReactNode }) { const { theme } = useTheme(); // Add this line to dynamically import the Crisp component const CrispWithNoSSR = dynamic(() => import("@/lib/support/crisp")); return ( <SessionProvider> <Toaster richColors position="bottom-right" expand={false} theme={theme === "dark" ? "light" : "dark"} /> // Add the component with <SessionProvider> <CrispWithNoSSR /> {children} </SessionProvider> ); }
Tracking Pixels