> ## Documentation Index
> Fetch the complete documentation index at: https://docs.yourhomie.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# Google Tag Manager

> Rolle das homie-AI-Chat-Widget in unter einer Minute über einen Custom-HTML-Tag im Google Tag Manager aus.

Du kannst homie AI über den Google Tag Manager (GTM) ausrollen, ganz ohne Theme-Code anzufassen. Das ist ideal, wenn mehrere Properties denselben Container nutzen oder du alle Tags deiner Seite zentral verwaltest.

<Note>
  Bevor du startest, stelle sicher, dass du Folgendes hast:

  * Einen in der Plattform erstellten Assistenten
  * Dein aus dem **Veröffentlichen**-Bereich des Assistenten kopiertes Embed Script
  * Zugriff auf einen Google-Tag-Manager-Container auf deiner Seite
</Note>

## Custom-HTML-Tag hinzufügen

<Steps>
  <Step title="Embed Script kopieren">
    Öffne deinen Assistenten in der Plattform, gehe zu seinem **Veröffentlichen**-Bereich, wähle **Google Tag Manager** und kopiere das Script. Es enthält bereits deine `chatbotId`.

    <Frame>
      <img src="https://mintcdn.com/homieai/m0ZcYuq9OdpATfdE/images/Bildschirmfoto-2026-07-01-um-11.59.23.png?fit=max&auto=format&n=m0ZcYuq9OdpATfdE&q=85&s=66c49095afb58b3488c991553679d1b0" alt="Veröffentlichen-Bereich in der Plattform mit dem kopierbaren Script-Snippet" lightAlt="Veröffentlichen-Bereich in der Plattform mit dem kopierbaren Script-Snippet" darkAlt="Veröffentlichen-Bereich in der Plattform mit dem kopierbaren Script-Snippet" className="dark:hidden" width="3004" height="1396" data-path="images/Bildschirmfoto-2026-07-01-um-11.59.23.png" />

      <img src="https://mintcdn.com/homieai/m0ZcYuq9OdpATfdE/images/Bildschirmfoto-2026-07-01-um-11.59.23-1.png?fit=max&auto=format&n=m0ZcYuq9OdpATfdE&q=85&s=18fe0da76f9a32b6884ddd9ae7abc462" alt="Veröffentlichen-Bereich in der Plattform mit dem kopierbaren Script-Snippet" lightAlt="Veröffentlichen-Bereich in der Plattform mit dem kopierbaren Script-Snippet" darkAlt="Veröffentlichen-Bereich in der Plattform mit dem kopierbaren Script-Snippet" className="hidden dark:block" width="3004" height="1396" data-path="images/Bildschirmfoto-2026-07-01-um-11.59.23-1.png" />
    </Frame>
  </Step>

  <Step title="Neuen Custom-HTML-Tag erstellen">
    Melde dich bei [tagmanager.google.com](https://tagmanager.google.com) an, wähle deinen Container und gehe zu **Tags → Neu → Custom HTML**.

    Füge das Embed Script in das HTML-Feld ein. Die Tag-Manager-Variante konfiguriert das Widget über `window.homieBotConfig` und bindet es selbst ein, weil Custom-HTML-Tags Skripte so laden, dass Attribute nicht direkt ausgelesen werden können:

    ```html theme={null}
    <script>
      (function () {
        window.homieBotConfig = {
          chatbotId: "YOUR-CHATBOT-ID",
          domain: "https://chat.yourhomie.ai"
        };
        var script = document.createElement("script");
        script.src = "https://cdn.yourhomie.ai/embed.min.js";
        script.defer = true;
        if (document.readyState === "loading") {
          document.addEventListener("DOMContentLoaded", function () {
            document.body.appendChild(script);
          });
        } else {
          document.body.appendChild(script);
        }
      })();
    </script>
    ```
  </Step>

  <Step title="Trigger auf All Pages setzen">
    Wähle den **All Pages**-Trigger, damit die Chat-Bubble seitenweit geladen wird.

    <Frame>
      <img src="https://mintcdn.com/homieai/t1ZSM74lXOpzsQLS/images/integrations/gtm/gtm.png?fit=max&auto=format&n=t1ZSM74lXOpzsQLS&q=85&s=81ab22811cfb5f329bc2956e16fd1027" alt="Google Tag Manager mit ausgewähltem All-Pages-Trigger für den homie-Tag" width="1496" height="1048" data-path="images/integrations/gtm/gtm.png" />
    </Frame>
  </Step>

  <Step title="Senden und veröffentlichen">
    Klicke auf **Submit** und dann auf **Publish**. GTM stellt den Tag sofort bereit.
  </Step>
</Steps>

<Check>
  Lade deine Seite neu. Die homie-Chat-Bubble erscheint unten rechts. Öffne sie und sende eine Testnachricht.
</Check>

<Tip>
  Nutze die integrierten GTM-Umgebungen, um den Tag in einer Vorschau zu testen, bevor du in die Produktion veröffentlichst.
</Tip>

## Fehlerbehebung

* **Tag feuert, aber keine Bubble?** Deaktiviere Script-Blocker und leere deinen Cache.
* **Nur auf bestimmten Seiten?** Passe den Trigger auf eine **Page View**-Regel an, die zu den gewünschten Seiten passt.
* **Mehrere Umgebungen?** Nutze GTM-Umgebungen zur Prüfung, bevor du live gehst.

Für tiefergehende Konfiguration und Methoden siehe die [Client API](/de/api-reference/client/overview).

## Nächste Schritte

<CardGroup cols={2}>
  <Card title="Client API" icon="code" href="/de/api-reference/client/overview">
    Konfiguriere das Widget und rufe Methoden von deiner Seite auf.
  </Card>

  <Card title="Installation – Überblick" icon="plug" href="/de/user-guide/installation/overview">
    Vergleiche die Installationsmethoden für jede Plattform.
  </Card>
</CardGroup>
