1. All Collections >
  2. Kanäle >
  3. Webseiten-Chat-Widget >
  4. Website-Chat-Widget auf WordPress installieren

Website-Chat-Widget auf WordPress installieren

Avatar
JQ Lee
3 Min. Lesezeit

Das Hinzufügen eines Web-Chat-Widgets zu Ihrer WordPress-Website ist ein schneller und einfacher Vorgang. Es sind keine Programmierkenntnisse oder technischen Kenntnisse erforderlich.

Vorbereiten der Installation

Um ein Web-Chat-Widget auf WordPress zu installieren, benötigen Sie Folgendes:

  • Zugriff auf das WordPress-Dashboard Ihrer Website'.

  • Ein Code-Schnipsel für Ihr Web-Chat-Widget.

Wenn du noch keinen Codeausschnitt hast, wirst du einen generieren, wenn du ein respond.io Website-Chat-Widget erstellst oder das Facebook-Chat-Plugin für Facebook Messenger verwendest.

Wenn Sie die Kanäle bereits mit der respond.io-Plattform verbunden haben und den generierten Codeausschnitt abrufen müssen, befolgen Sie die Anweisungen hier.

Stellen Sie für eine erfolgreiche Installation sicher, dass die Domain Ihrer Website ausgefüllt ist. Hierzu gibt es zwei Möglichkeiten.

Gehen Sie zu respond.io Einstellungen > wählen Sie Kanäle > wählen Sie Ihren Website-Chat-Kanal > klicken Sie auf Konfigurieren > fügen Sie die Website-Domain hinzu. 

Gehen Sie zu den respond.io-Einstellungen > , wählen Sie Wachstums-Widgets > , klicken Sie auf das Widget, das Sie Ihrer Website hinzufügen möchten > , und fügen Sie im Umschalter Allgemein Ihre Website-Domain zum Feld Website-Domains hinzu.

Installation auf WordPress

Schritt 1: Melden Sie sich bei WordPress an

Navigieren Sie zum WordPress-Admin-Dashboard Ihrer Website und melden Sie sich an.

Schritt 2: Navigieren Sie zur Plugins-Seite

Klicken Sie im linken Navigationsbereich auf Plugins. Auf der Plugins-Seite klicken Sie oben auf die blaue Schaltfläche „Neu hinzufügen“.

Schritt 3: Neues Plugin hinzufügen

Suchen Sie mithilfe der Suchleiste nach dem Plugin WPCode . Drücken Sie die Schaltfläche Jetzt installieren und aktivieren Sie das Plugin, um es verwenden zu können. Drücken Sie die Schaltfläche Jetzt installieren und stellen Sie sicher, dass Sie das Plugin aktivieren, um es nutzen zu können.

Schritt 4: Kopf- und Fußzeilenkonsole öffnen

Klicken Sie im linken Navigationsmenü auf „Code-Snippets“ und wählen Sie im Untermenü „ Header & Footer “ aus.

Schritt 5: Live-Chat-Skript hinzufügen

Kopieren Sie Ihr Plugin-Skript von respond.io und fügen Sie es in den Abschnitt „ Skript im Fußbereich “ der Kopf- und Fußzeilen-Konsolenseite ein.

Nachdem Sie das Skript eingefügt haben, klicken Sie unten auf der Seite auf die blaue Schaltfläche "Speichern" .

Erledigt!

Öffnen Sie die Website und sehen Sie sich das Chat-Plugin an. Sie finden es in der unteren rechten Ecke. Jetzt können Ihre Website-Besucher mühelos mit Ihnen chatten. Wenn Sie die von der respond.io-Plattform generierten Code-Snippets verwendet haben, können Sie die Konversationen verwalten und das Erscheinungsbild des Widgets von der Plattform aus aktualisieren.

Das Chat-Widget ist jetzt auf Ihrer Website aktiv!

Angemeldete Benutzer identifizieren

Dieser Abschnitt ist nur anwendbar, wenn Ihre Website über eine Benutzeranmeldefunktion verfügt.

Schritt 1: Melden Sie sich bei Ihrem WordPress-Konto an

Navigieren Sie zum WordPress-Admin-Dashboard Ihrer Website und melden Sie sich an.

Schritt 2: Öffnen Sie die Theme-Header-Dateien

Klicke im linken Navigationsmenü auf Darstellung und wähle den Theme-Datei-Editor aus. Wählen Sie die Datei Theme Header aus.

Schritt 3: Hinzufügen der abgerufenen Benutzer-ID und des Namenscodes

Kopieren Sie den Beispielcode unten und fügen Sie ihn in die Theme-Header-Datei ein. Nachdem Sie den Code eingefügt haben, klicken Sie unten auf der Seite auf die Schaltfläche Datei aktualisieren .

Der folgende Beispielcode dient dazu, die Benutzer-ID sowie den Vornamen und Nachnamen von WordPress abzurufen. Sie können die Angaben gerne ändern, wenn Sie weitere Kontaktfelder wünschen.

<?php 
	$user_info = get_userdata(get_current_user_id());
?>

<script type="text/javascript">
	Fenster.$wp_ID = "<?php echo $user_info->ID; ?>";
	Fenster.$wp_firstname = "<?php echo $user_info->Vorname; ?>";
	Fenster.$wp_lastname = "<?php echo $user_info->Nachname; ?>";
</script>

`

Schritt 4: Kopf- und Fußzeilenkonsole öffnen

Klicke im linken Navigationsmenü auf Einstellungen und wähle das Plugin Header & Footer aus dem Untermenü 'Einstellungen' aus.

Schritt 5: Hinzufügen des Skripts „Angemeldeten Benutzer identifizieren“

Kopieren Sie den folgenden Beispielcode und fügen Sie ihn in den Abschnitt „ -Skript im Fußbereich “ der Kopf- und Fußzeilen-Konsolenseite ein. Beachten Sie, dass das Skript zur Identifizierung des angemeldeten Benutzers über dem Skript für den Live-Chatplatziert werden muss.

Der folgende Beispielcode verwendet die Benutzer-ID als Kennung und übergibt den Vor- und Nachnamen. Sie können die Angaben gerne ändern, wenn Sie weitere Kontaktfelder wünschen.

Nachdem du das Skript eingefügt hast, klicke unten auf der Seite auf die blaue Schaltfläche "Speichern".

Erledigt!

Öffne die Website und sehe dir das Chat-Plugin an. Die angemeldeten Benutzer Ihres WordPress können identifiziert werden. Sobald die übergebene Kennung einem bestehenden Kontakt zugeordnet wird, wird die aktuelle Konversation fortgesetzt.

FAQ und Fehlerbehebung

WPCode

Wenn du ein WordPress-Cache-Plugin wie WPCode verwendest, folge diesen Schritten, damit das Widget korrekt angezeigt wird.

Deaktivieren Sie die Datenminimierungsfunktion für JavaScript

Gehe zu Wordpress-Einstellungen > Wähle WPCode > Auf der WPCode-Seite, wähle die Registerkarte Dateioptimierung > deaktiviere JavaScript-Dateien minimieren.

Füge unsere Widget-Domain zu den von JavaScript ausgeschlossenen Dateien hinzu.

https://cdn.respond.io/webchat/widget/(.*).js

Nach dem Speichern wird empfohlen, den Cache in WordPress zu leeren.

Diesen Artikel teilen
Telegram
Facebook
Linkedin
Twitter

Sie können nicht finden, was Sie suchen? 🔎