---
title: Agent auf WordPress und WooCommerce installieren
description: Drei Methoden, den Code in WordPress einzubetten, wie der Agent den WooCommerce-Katalog ausliest, der Umgang mit Caching-Plugins und die Verknüpfung des Chats mit dem Warenkorb.
section: platforms
keywords: WordPress, WooCommerce, Chatbot WordPress, KI-Agent WordPress, Live-Chat Onlineshop, AI Sales Agent, Code einfügen WordPress, footer.php, Widget für Website, E-Commerce Chatbot, Virtueller Assistent Shop, Installation WordPress Chat, WooCommerce Chat Integration
updated: 2026-09-06
---
Auf WordPress lässt sich der Code auf drei Arten einfügen. Wählen Sie die Methode, die Ihnen am besten liegt, je nachdem, wie vertraut Sie mit der Bearbeitung von Theme-Dateien sind.

## Methode 1: Code-Einfüge-Plugin (empfohlen)

Die sicherste Variante: Änderungen gehen bei einem Theme-Update nicht verloren.

1. Installieren Sie ein beliebiges Plugin zum Einfügen von Skripten: WPCode, Insert Headers and Footers, Code Snippets.
2. Öffnen Sie die Plugin-Einstellungen und suchen Sie das Feld für den Code im Footer – es heißt normalerweise **Footer** oder **Body (before closing tag)**.
3. Fügen Sie die Zeile aus dem Admin-Bereich ein und speichern Sie.

## Methode 2: Theme-Datei

1. **Design → Theme-Datei-Editor**.
2. Öffnen Sie `footer.php`.
3. Fügen Sie den Code vor `</body>` ein.
4. Aktualisieren Sie die Datei.

Wichtig: Bearbeiten Sie ein Child-Theme. Bei einem Update des Parent-Themes wird die Datei zusammen mit Ihrem Code überschrieben.

## Methode 3: Über functions.php

Für Code-affine Nutzer. In der `functions.php` des Child-Themes:

```php
add_action('wp_footer', function () {
echo '<script src="https://comag.vibevox.pro/widget.js" data-slug="Ihr-Slug" async></script>';
});
```

Die genaue Skriptzeile finden Sie im Admin-Bereich über die Schaltfläche „Code kopieren“.

## WooCommerce-Katalog

Geben Sie die Website-Adresse in den Einstellungen an und starten Sie die Analyse. Der Crawler liest WooCommerce-Produkte über die strukturierten Daten der Seiten: Name, Preis, Verfügbarkeit, Beschreibung, Fotos, Kategorien.

Was Sie wissen sollten:

- **Variable Produkte** erscheinen in der Produktkarte mit Preisspanne und Eigenschaften.
- **Versteckte Produkte und Entwürfe** werden nicht gelesen – das ist beabsichtigt.
- **Produkte nur für autorisierte Benutzer** sieht der Agent nicht: Er durchsucht die Website wie ein normaler Besucher.
- Wenn Sie einen Produkt-Export im CSV-Format haben, können Sie diesen im Bereich „Katalog“ hochladen – manchmal ist das schneller und genauer als das Crawling.

## Warenkorb und Bezahlung

Bei WooCommerce wird die Bezahlung im Chat normalerweise nicht aktiviert: Der Shop hat seine eigene Kasse mit Versand, Steuern und Gutscheinen.

Geben Sie in den Einstellungen den Link zum Warenkorb an, meistens `https://ihre-domain/cart` oder `/warenkorb`. Der Agent führt den Käufer dorthin.

Um zu sehen, welche Dialoge zu Bestellungen führen, fügen Sie den Kaufpixel-Code auf der Seite „Vielen Dank für Ihre Bestellung“ hinzu. In WooCommerce ist dies die Vorlage `checkout/thankyou.php` oder dasselbe Code-Einfüge-Plugin mit einer Bedingung für die Bestellseite.

## Schaltfläche im Chat legt Produkt in den WooCommerce-Warenkorb

Produktkarten in den Agentenantworten sind keine bloßen Bilder zur Dekoration. Jede Karte enthält einen Link zur Produktseite in Ihrem Shop, und der Agent kann den Standard-WooCommerce-Mechanismus zum Hinzufügen zum Warenkorb nutzen: eine Adresse der Form `?add-to-cart=123`.

Der Käufer klickt im Chat auf die Schaltfläche, das Produkt landet im Warenkorb, und Ihre Kasse mit allen Versand-, Gutschein- und Steuer-Plugins übernimmt. Dafür sind keine Integrationen oder Schlüssel erforderlich: Der Mechanismus ist von Haus aus in WooCommerce integriert.

Wenn der Link zu einer Seite mit einem variablen Produkt führt, öffnet der Agent diese – der Käufer muss Größe und Farbe selbst auswählen, und das ist richtig: Eine Variante für ihn vorzugeben, wäre riskant.

Eine weitere wichtige Information: Der Agent sieht die Seite, auf der der Chat geöffnet ist. Er liest die Produktauszeichnung – Name, Artikelnummer, Preis – und antwortet im Kontext. Steht ein Besucher auf einer Produktkarte und fragt „Gibt es das auch günstiger?“, versteht der Agent, womit er vergleichen soll, und bietet eine Alternative aus Ihrem Katalog an, statt einen abstrakten Ratschlag zu geben.

Der Hauptgrund, warum das Widget auf WordPress nicht erscheint, ist der Cache. Nach dem Einfügen des Codes:

1. Leeren Sie den Plugin-Cache: WP Rocket, W3 Total Cache, LiteSpeed oder was immer Sie verwenden.
2. Leeren Sie den CDN-Cache, falls Sie Cloudflare nutzen.
3. Überprüfen Sie die Website im Inkognito-Modus.

Wenn im Plugin „Skripte zusammenführen und verzögert laden“ aktiviert ist, fügen Sie unser Skript zu den Ausnahmen hinzu: Das Zusammenführen von Drittanbieter-Skripten kann manchmal den Ladevorgang stören.

## Helles und dunkles Theme

Das Widget beherrscht beides. In den Einstellungen wählen Sie ein helles Theme, ein dunkles oder „wie beim Besucher“ – Letzteres folgt den Systemeinstellungen des Geräts und ist standardmäßig aktiviert.

Das ist praktisch, wenn Ihr WordPress-Theme einen Tag-Nacht-Umschalter hat: Belassen Sie es bei „wie beim Besucher“, und der Chat stimmt mit der bereits getroffenen Auswahl des Benutzers überein.

## Caching-Plugins

## Überprüfung

- Die Chat-Schaltfläche erscheint in der unteren rechten Ecke auf jeder Seite der Website.
- Eine Frage zu einem Produkt liefert eine Produktkarte mit Preis.
- Die Schaltfläche zur Bestellung führt zum WooCommerce-Warenkorb.
- Auf Mobilgeräten überdeckt die Schaltfläche weder Menü noch Warenkorb.

## Häufig gestellte Fragen

### Ist ein separates Commerce Agents Plugin erforderlich?

Nein. Eine Codezeile genügt, ein separates Plugin ist nicht erforderlich und wird nicht installiert.

### Das Widget erscheint nicht, was zuerst prüfen?

Den Cache: Caching-Plugin und CDN. Danach, ob der Code im Footer eingefügt wurde und nicht in einem beliebigen Sidebar-Widget, und ob das Theme tatsächlich `wp_footer()` ausgibt.

### Weiß der Agent über Rabatte und Gutscheine Bescheid?

Über Gutscheine nicht: Diese werden im WooCommerce-Warenkorb angewendet. Der Agent zeigt die Preise an, die beim Crawling erfasst wurden, einschließlich des reduzierten Preises, falls dieser auf der Produktseite angezeigt wird.

### Verlangsamt dies die Website?

Das Skript ist asynchron, wiegt wenig und blockiert das Rendern der Seite nicht. Der Einfluss auf PageSpeed ist minimal.

### Kann das Widget nur im Shop und nicht im Blog angezeigt werden?

Ja, wenn der Code über ein Plugin mit Anzeige-Bedingungen oder in `functions.php` mit einer `is_woocommerce()`-Prüfung eingefügt wird. Im einfachen Fall stört der Agent auf allen Seiten nicht: Er beantwortet auch Fragen zur Lieferung aus dem Blog.
