Voraussetzungen

Bevor Sie beginnen, stellen Sie sicher, dass Sie Folgendes haben:

Ein Eagle Agents Konto mit einem konfigurierten KI-Agenten

Administratorzugriff auf Ihre WordPress Webseite

​
Integrationsmethoden

Es gibt drei Hauptmethoden, um Ihr Eagle Agent Widget in WordPress zu integrieren:

Plugin-Methode

Verwendung des “Insert Headers and Footers” Plugins

Theme-Editor-Methode

Direkte Bearbeitung der header.php-Datei Ihres Themes

Elementor-Methode

Verwendung der benutzerdefinierten Code-Funktion von Elementor

​
Eagle Agent Widget-Code

Bevor Sie mit einer Methode fortfahren, benötigen Sie Ihren Eagle Agent Widget-Code: 
<div id="VG_OVERLAY_CONTAINER"></div>
<script defer>
    (function() {
        window.VG_CONFIG = {
            ID: "YOUR_AGENT_ID", // Replace with your actual agent ID
            region: 'eu', // or 'na' for North America
            render: 'bottom-right', // or 'bottom-left'
            // modalMode: true, // Set this to 'true' to open the widget in modal mode
            stylesheets: [
                "https://vg-bunny-cdn.b-cdn.net/vg_live_build/styles.css",
            ],
        }
        var VG_SCRIPT = document.createElement("script");
        VG_SCRIPT.src = "https://vg-bunny-cdn.b-cdn.net/vg_live_build/vg_bundle.js";
        VG_SCRIPT.defer = true;
        document.body.appendChild(VG_SCRIPT);
    })()
</script>
Denken Sie daran, YOUR_AGENT_ID durch Ihre tatsächliche Eagle Agent ID zu ersetzen.

​
Methode 1: Verwendung eines Plugins

1

Plugin installieren

  1. Öffnen Sie Ihr WordPress-Dashboard
  2. Gehen Sie zu Plugins > Add New
  3. Suchen Sie nach Insert Headers and Footers
  4. Installieren und aktivieren Sie das Plugin von WPBrigade
2

Auf Plugin-Einstellungen zugreifen

Gehen Sie zu Settings > WP Headers and Footers in der Seitenleiste
3

Widget-Code hinzufügen

Fügen Sie den Eagle Agent Widget-Code im Header-Abschnitt ein
4

Änderungen speichern

Klicken Sie auf Save Changes

​
Methode 2: Verwendung des Theme-Editors

Das direkte Bearbeiten von Theme-Dateien kann Ihre Webseite beschädigen, wenn es nicht korrekt durchgeführt wird. Erstellen Sie immer ein Backup Ihrer Webseite, bevor Sie Änderungen vornehmen.
1

Auf Theme-Editor zugreifen

  1. Öffnen Sie Ihr WordPress-Dashboard
  2. Gehen Sie zu Appearance > Theme File Editor
2

Header-Datei bearbeiten

  1. Finden und öffnen Sie im Abschnitt Theme Files auf der rechten Seite die header.php-Datei
  2. Suchen Sie das schliessende </head>-Tag
3

Widget-Code hinzufügen

Fügen Sie den Eagle Agent Widget-Code direkt vor dem schliessenden </head>-Tag ein
4

Änderungen speichern

Klicken Sie auf Update File, um Ihre Änderungen zu speichern

​
Methode 3: Verwendung von Elementor

1

Auf benutzerdefinierten Code von Elementor zugreifen

  1. Melden Sie sich im WP Admin an
  2. Gehen Sie zu Elementor > Custom Code
2

Neuen benutzerdefinierten Code hinzufügen

Klicken Sie auf Add New Custom Code
3

Benutzerdefinierten Code konfigurieren

  1. Geben Sie einen Titel für Ihren Codeschnipsel ein
  2. Wählen Sie den Location:
    • <head> für Seitenebene
    • <body> - Start für den Anfang des Seiteninhalt
    • <body> - End für das Ende des Seiteninhalts
  3. Setzen Sie die Priority (1-10, niedrigere Zahlen haben höhere Priorität)
  4. Fügen Sie den Eagle Agent Widget-Code im Code-Block-Editor ein
4

Anzeigebedingungen festlegen

  1. Klicken Sie im Publish-Block neben Conditions auf Edit
  2. Legen Sie die gewünschten Bedingungen fest, wo das Widget erscheinen soll
5

Veröffentlichen

Klicken Sie auf Publish, um Ihre Änderungen live zu schalten

​
Anpassungsoptionen

Sie können das Verhalten und Erscheinungsbild Ihres Widgets durch Anpassen der VG_CONFIG-Optionen anpassen:

​
Fehlerbehebung

Wenn Sie Probleme mit Ihrer Eagle Agent Widget-Integration haben:
  1. Überprüfen Sie, ob Sie den gesamten Codeschnipsel korrekt kopiert haben.
  2. Stellen Sie sicher, dass Sie “YOUR_AGENT_ID” durch Ihre tatsächliche Eagle Agent ID ersetzt haben.
  3. Leeren Sie Ihren Browser-Cache und aktualisieren Sie Ihre WordPress Webseite, um die Änderungen zu sehen.
  4. Wenn Sie ein Caching-Plugin verwenden, leeren Sie den Cache nach den Änderungen.
  5. Prüfen Sie auf Konflikte mit anderen Plugins oder Theme-Anpassungen.
Wenn Sie ein Sicherheits-Plugin verwenden, stellen Sie sicher, dass es das Laden der Eagle Agent Skripte nicht blockiert.