Wenn Sie eine Website mit Gatsby erstellt haben, können Sie ein Chatwoot Live-Chat-Widget hinzufügen und in Echtzeit mit Ihren Besuchern sprechen. Dies lässt sich in 3 einfachen Schritten mithilfe des Chatwoot Gatsby-Plugins erledigen.

## Schritt 1. Fügen Sie das Gatsby-Plugin zu Ihrem Projekt hinzu[​](https://www.chatwoot.com/hc/user-guide/articles/1784681449-wie-installiert-man-einen-live_chat-auf-einer-gatsby_website "Direct link to heading")

Fügen Sie `gatsby-plugin-chatwoot` zu Ihrem Gatsby-Projekt hinzu.

```
npm install --save gatsby-plugin-chatwoot
```

Wenn Sie yarn verwenden, nutzen Sie Folgendes:

```
yarn add gatsby-plugin-chatwoot
```

## Schritt 2. Fügen Sie das Plugin zu Ihrer Gatsby-Konfigurationsdatei hinzu[**​**](https://www.chatwoot.com/hc/user-guide/articles/1784681449-wie-installiert-man-einen-live_chat-auf-einer-gatsby_website "Direct link to heading")

```
// In Ihrer gatsby-config.js
plugins: [
  {
    resolve: `gatsby-plugin-chatwoot`,
    options: {
      baseUrl: "BASE_URL", // Erforderlich
      websiteToken: "WEBSITE_TOKEN", // Erforderlich
      includeInDevelopment: false, // Optional
      chatwootSettings: {}, // Optional
    },
  },
];
```

Ihren Website-Token und die Base URL finden Sie in den Inbox-Einstellungen Ihres Chatwoot-Kontos.

Falls Sie einen neuen Website-Kanal erstellen müssen, folgen Sie dem hier beschriebenen Ablauf [here](https://www.chatwoot.com/hc/user-guide/articles/1784681470-erlauterung-der-einstellungen-fur-den-website_live_chat).

## Schritt 3. Starten Sie Ihren Server[**​**](https://www.chatwoot.com/hc/user-guide/articles/1784681449-wie-installiert-man-einen-live_chat-auf-einer-gatsby_website "Direct link to heading")

Nun sollten Sie das Chatwoot-Widget auf der Seite sehen können.