Gatsby Integration

Add the Gatsby Plugin to Your Project

Install gatsby-plugin-chatwik in your Gatsby project:

npm install --save gatsby-plugin-chatwik

yarn add gatsby-plugin-chatwik

pnpm add gatsby-plugin-chatwik

Add the Plugin to Your Gatsby Config File

Add the plugin configuration to your gatsby-config.js file:

module.exports = {
  plugins: [
    {
      resolve: `gatsby-plugin-chatwik`,
      options: {
        baseUrl: "https://app.chatwik.com", // Required
        websiteToken: "YOUR_WEBSITE_TOKEN", // Required
        includeInDevelopment: false, // Optional
        chatwootSettings: {}, // Optional
      },
    },
  ],
};

You can get your website token and base URL from your inbox settings in your Chatwik account (Settings → Inboxes → select website inbox → Configuration tab). If you need to create a new website inbox, refer to the Website Live Chat Setup guide.

Start Your Server & Verify

Start your Gatsby development server or publish your site to see the Chatwik live chat widget live on your page:

gatsby develop