Chatim Help Center

How to install Chatim live chat widget on NextJs

Step 1: Generate and copy the widget code

  1. Go to the "Install" page in your Chatim account.
  2. Chatim will generate a JavaScript code snippet for your project.
  3. Click on the "Copy" button to copy the code to your clipboard. This code will be needed to embed the widget.

Step 2: Add the widget code to your Next.js project

Next, you need to embed the Chatim widget code into your Next.js project. You can do this by adding the script to the appropriate pages or layout files of your project.

  1. In your Next.js project, open the _app.js or _document.js file (usually located in the pages folder).
  2. In the _document.js file, you'll need to insert the Chatim widget code inside the <Head> component. This ensures the widget is included on all pages.
  3. Save the changes to your _document.js or _app.js file.
  4. Deploy your Next.js project to your hosting environment (e.g., Vercel, Netlify, or any other preferred service).

Step 3: Test the widget on your website

  1. Visit your NextJs website and refresh the page to see the Chatim widget in action.
  2. Test the live chat and chatbot functionalities to ensure they are working correctly.

Step 4: Adjust settings and monitor performance

Return to your Chatim dashboard to monitor customer interactions, view analytics, and make any necessary adjustments to the widget's behavior, appearance, or responses based on user feedback and engagement.

Need Help?

If you encounter any issues during the installation process contact us.