Einbetten von Kundenserviceoptionen in Ihre Website anhand des Web Widgets

Anhand des Web Widgets können Sie Zendesk Support-Funktionen in Ihre Website bzw. in Ihr Help Center einbetten, damit Kunden Hilfe in Anspruch nehmen können, ohne die Website bzw. das Help Center verlassen zu müssen. Kunden können schnell und einfach Folgendes tun:

• Suche nach Beiträgen in der Wissensdatenbank
• Live-Chat mit einem Agenten
• Kontaktformular zum Einreichen eines Tickets

Das Widget erscheint unten auf Ihrer Website oder im Help Center. Zuerst konfigurieren Sie die Komponenten, die im Widget erscheinen sollen, und dann fügen Sie den Widget-Code zu Ihrer Website bzw. zu Ihrem Help Center hinzu.

Zum Einrichten und Verwalten des Web Widgets sind Administratorrechte erforderlich.

Hinweis: Sie können jetzt das Web Widget mit beschränkten Help-Center-Inhalten verwenden. Weitere Informationen finden Sie unter Verwenden beschränkter Help-Center-Inhalte mit dem Web Widget.

 

In diesem Beitrag werden folgende Themen behandelt:

• Vom Web Widget unterstützte Browser
• Konfigurieren der Komponenten im Widget
• Hinzufügen des Widgets zu Ihrer Website bzw. zu Ihrem Help Center
• Hinzufügen angepasster Stichworte zu Widget-Tickets ausgehend von der Ausgangsseite
• Ablauf des Endbenutzererlebnisses
• Optimieren von Help-Center-Bildern für das Widget
• Entfernen des Widgets von Ihrer Website bzw. aus Ihrem Help Center

Vom Web Widget unterstützte Browser

Das Web Widget wird in den folgenden Browsern unterstützt (Stand: 23. Januar 2017).

Auf dem Desktop

• Google Chrome: die beiden neuesten Versionen
• Microsoft Internet Explorer: die beiden neuesten Versionen
  Hinweis: Internet Explorer 11 hat Probleme mit Speicherlecks, was sich negativ auf die Leistung auswirken kann.
• Mobil:
• Mozilla Firefox: die neueste Version
• Apple Safari: die neuesten Version

Auf Mobilgeräten

• iOS Safari: die beiden neuesten Versionen
• Android-Browser: die neueste Version
• Chrome Mobile für Android und iOS: die neueste Version

Konfigurieren der Komponenten im Widget

Sie können das Widget so konfigurieren, dass die folgenden Komponenten erscheinen:

• Suche nach Beiträgen in der Help-Center-Wissensdatenbank
• Zendesk Chat für Live-Chat mit einem Agenten
• Kontaktformular zum Einreichen eines Tickets in Zendesk Support
• Vorgeschlagene Beiträge basierend auf der Webseite, auf der sich der Benutzer befindet (Kontexthilfe)

Hinweis: Wenn Ihre Widget-Ergebnisse auch beschränkte Help-Center-Ergebnisse enthalten sollen, müssen Sie weitere Einstellungen konfigurieren. Nähere Informationen finden Sie unter Verwenden beschränkter Help-Center-Inhalte mit dem Web Widget.

Sie können eine oder mehrere Komponenten wie folgt miteinander kombinieren:

• Nur Kontaktformular
• Nur Zendesk Chat
• Kontaktformular und Zendesk Chat
• Kontaktformular und Help Center
• Kontaktformular und Zendesk Chat und Help Center

Wenn Sie mehrere Komponenten aktivieren, werden die entsprechenden Optionen Ihren Kunden zu unterschiedlichen Zeiten präsentiert, nicht gleichzeitig. Weitere Informationen zur Darstellung dieser Optionen finden Sie unter Ablauf des Endbenutzererlebnisses.

Sie können angeben, ob das Widget links oder rechts auf der Seite erscheinen soll. Beim Enterprise-Plan können Sie das Logo aus dem Widget entfernen. Über die API können Sie zusätzliche Anpassungen vornehmen (siehe Erweiterte Anpassung des Web Widgets).

Wenn Sie das Web Widget hinzufügen, können Sie Ihre Help-Center-Metriken (Beitragsaufrufe und Suchen) besser analysieren, da Sie auch nach Tickets filtern können, die über das Web Widget eingereicht werden. Weitere Informationen zu Help-Center-Analysen finden Sie unter Analysieren der Suchergebnisse im Help Center (Professional und Enterprise) und Analysieren der Aktivität in der Help-Center-Community und -Wissensdatenbank (Professional und Enterprise).

So konfigurieren Sie das Widget

1. Klicken Sie in der Seitenleiste auf das Symbol Admin () und dann auf Kanäle > Widget.
2. Klicken Sie auf die Registerkarte Anpassung.

   Wenn Sie das Widget zum ersten Mal einrichten, klicken Sie zuerst auf Loslegen und dann auf die Registerkarte Anpassen.

3. Aktivieren Sie die Komponenten, die im Widget erscheinen sollen:
   • Kontaktformular: Klicken Sie auf Aus, wenn Sie nicht möchten, dass Kunden Tickets über das Widget einreichen.

     

     Das Kontaktformular ist standardmäßig aktiviert. Über das Widget eingereichte Tickets enthalten das Stichwort „web_widget“.

   • Angepasste Ticketfelder: Klicken Sie auf das Dropdownmenü und wählen Sie dann ein oder zwei angepasste Ticketfelder aus, die im Kontaktformular im Web Widget erscheinen sollen.

     Sie können maximal zwei angepasste Ticketfelder hinzufügen. Reguläre Ausdrücke und angepasste Datumsfelder werden nicht unterstützt. Ticketformulare werden ebenfalls nicht unterstützt.

     

     Hinweis: Diese Option erscheint nicht, wenn Sie das Kontaktformular nicht aktiviert haben oder wenn es keine angepassten Ticketfelder gibt, die für Endbenutzer sichtbar sind und von ihnen bearbeitet werden können. Nur sicht- und bearbeitbare angepasste Felder erscheinen in der Liste. Damit ein angepasstes Feld im Widget verfügbar ist, müssen Sie in den Einstellungen für das angepasste Feld Für Endbenutzer: Sichtbar und Für Endbenutzer: Bearbeitbar auswählen (siehe Hinzufügen eines angepassten Ticketfelds).
   • Chat: Klicken Sie auf Ein, wenn Kunden vom Widget aus die Möglichkeit haben sollen, über Zendesk Chat mit Ihren Agenten zu chatten.

     Diese Option ist nicht verfügbar, wenn Sie Zendesk Chat nicht aktiviert haben. Klicken Sie auf Chat einrichten, um Zendesk Chat jetzt zu aktivieren. 

     Tipp: Das Web Widget kann anstelle des Zendesk Chat-Widgets verwendet werden.
   • Help Center: Klicken Sie auf Ein, wenn vom Widget aus eine Suche im Help Center möglich sein soll.

     Diese Option ist nicht verfügbar, wenn Sie das Help Center nicht für Zendesk Support aktiviert haben. Klicken Sie auf Help Center einrichten, um das Help Center jetzt einzurichten.

   • Kontexthilfe: Klicken Sie auf Ein, wenn vom Widget aus eine Kontextsuche möglich sein soll. Die Kontexthilfe schlägt dem Endbenutzer Beiträge vor, die basierend auf der Seite, von der aus er auf das Widget zugegriffen hat, möglicherweise für ihn relevant sind.

     Hinweis: Um die Kontexthilfe zu verwenden, muss die Help-Center-Option aktiviert sein.
4. Klicken Sie neben Zendesk-Logo auf Aus, wenn Sie nicht möchten, dass das Zendesk-Logo im Widget erscheinen soll (nur Enterprise).
5. Klicken Sie neben Designfarbe auf das Farbfeld, um die gewünschte Farbe für das Widget auszuwählen.

   

   Klicken Sie nach Auswahl der Farbe einfach an eine andere Stelle, um die Farbauswahl zu schließen.

6. Für Position: Wählen Sie im Dropdownmenü entweder Rechts oder Links aus.

   Ihre Auswahl bestimmt, ob das Widget unten rechts oder unten links auf der Seite erscheint.

7. Wählen Sie im Dropdownmenü Text für Web-Widget-Schaltfläche den Text aus, der auf der Web-Widget-Schaltfläche angezeigt werden soll.

   

8. Wählen Sie im Dropdownmenü Text für Text für Kontaktformular-Schaltfläche den Text aus, der auf der Kontaktformular-Schaltfläche angezeigt werden soll.

   

9. Klicken Sie auf Änderungen speichern.

   Jetzt können Sie in der Registerkarte „Einrichtung“ den Widget-Code kopieren und zu Ihrer Website bzw. zu Ihrem Help Center hinzufügen.

Hinzufügen des Widgets zu Ihrer Website bzw. zu Ihrem Help Center

Das Web Widget ist für Mobilgeräte optimiert und wirkt sich nicht auf die Ladedauer einer Seite aus. Es wird jeweils in der Sprache des Endbenutzers angezeigt, basierend auf der Spracheinstellung des Webbrowsers. Bei Bedarf können Sie dafür sorgen, dass das Widget immer in einer bestimmten Sprache erscheint (siehe Anzeigen des Widgets in einer anderen Sprache).

Sie können das Web Widget zu jeder beliebigen Seite Ihrer Website bzw. zu Ihrem Help Center hinzufügen. Nachdem Sie den Code hinzugefügt haben, können Sie Aktualisierungen direkt von Zendesk Support aus und mit den JavaScript-API für erweiterte Anpassungen vornehmen. Die Änderungen erscheinen dann automatisch im Widget.

Die SSO-Authentifizierung kann nicht im Web Widget selbst verwendet werden. Sie können aber den Zugriff einschränken, indem Sie SSO im Help Center einrichten oder auf der Website, auf der das Widget gehostet wird. Weitere Informationen finden Sie unter Optionen zum Single-Sign-On (SSO) in Zendesk Support und Verwenden beschränkter Help-Center-Inhalte mit dem Web Widget.

Hinweis: Über die API können Sie zusätzliche Anpassungen vornehmen (siehe Erweiterte Anpassung des Web Widgets).

So fügen Sie das Web Widget zu Ihrer Website hinzu

1. Klicken Sie in der Seitenleiste auf das Symbol Admin () und dann auf Kanäle > Widget.
2. Klicken Sie auf die Registerkarte Einrichtung, sofern sie noch nicht ausgewählt ist.
3. Klicken Sie unter dem Feld mit dem Code auf In Zwischenablage kopieren.

   

4. Fügen Sie den Code für das Web Widget im HTML-Quellcode Ihrer Website vor dem abschließenden Tag </HEAD> im HTML-Quellcode ein.

   Sie müssen den Code zu jeder Webseite hinzufügen, auf der das Widget erscheinen soll.

So fügen Sie das Web Widget zum Help Center hinzu

1. Klicken Sie in der Seitenleiste auf das Symbol Admin () und dann auf Kanäle > Widget.
2. Klicken Sie auf die Registerkarte Einrichtung, sofern sie noch nicht ausgewählt ist.
3. Klicken Sie auf den Schalter Zu Help Center hinzufügen.
   

   Dadurch wird das Web Widget zum Kopfbereich für das Help Center hinzugefügt und erscheint auf jeder Seite im Help Center.

Beim Team-, Professional- oder Enterprise-Plan von Zendesk Support können Sie die Help-Center-Seiten, auf denen das Web Widget erscheint, über die Web Widget API einschränken, und zwar durch Änderung der Methode zE.hide. Weitere Informationen finden Sie unter Erweiterte Anpassung des Web Widgets und in der Dokumentation zur Web Widget API.

 

Bei Help Centern mit Host-Mapping und beschränkten Inhalten müssen Sie das Snippet u. U. manuell einfügen und die Subdomäne in die Host-Mapping-Domäne ändern, damit die beschränkten Inhalte für das Web Widget aktiviert werden.

Hinzufügen angepasster Stichworte zu Widget-Tickets ausgehend von der Ausgangsseite

Alle über das Web Widget eingereichten Tickets enthalten die URL der Seite, auf der sich der Benutzer beim Einreichen des Tickets befand. Zur Optimierung des Ticket-Workflows können Administratoren mithilfe von Auslösern dafür sorgen, dass ausgehend von der jeweiligen Seite angepasste Stichworte hinzugefügt, die Tickets einem bestimmte Agenten zugewiesen oder andere Aktionen für die von der jeweiligen Seite stammenden Tickets durchgeführt werden.

Allgemeine Informationen zu Auslösern finden Sie unter Ressourcen zum Thema Auslöser.

Angenommen, Sie sind der Administrator einer Website mit Gesundheitsinformationen und möchten das Stichwort „Erdnussallergien“ zu allen Tickets hinzufügen, die über das Web Widget von einem Help-Center-Beitrag zum Thema Erdnussallergien aus eingereicht werden.

So fügen Sie ein auf der Ausgangsseite basierendes angepasstes Stichwort hinzu

1. Klicken Sie in der Seitenleiste auf das Admin-Symbol und dann auf „Auslöser“.
2. Klicken Sie auf der Seite „Auslöser“ auf „Auslöser hinzufügen“.
3. Geben Sie einen aussagekräftigen Titel für den Auslöser ein.
4. Wählen Sie in den Dropdownmenüs unter Wenn alle der folgenden Bedingungen erfüllt sind die folgenden Optionen aus:
   • Ticket: Kanal
   • ist
   • Web Widget

     Klicken Sie auf das Pluszeichen und fügen Sie eine weitere Bedingung mit den folgenden Optionen hinzu:

   • Ticket: Kommentartext...
   • Enthält die folgende Zeichenfolge
   • Im Texteingabefeld: Geben Sie die URL der Seite ein, für die das angepasste Stichwort hinzugefügt werden soll.
5. Wählen Sie im Abschnitt „Diese Aktionen durchführen“ die folgenden Optionen aus:
   • Im Dropdownmenü: Ticket: Stichworte hinzufügen
   • Im Texteingabefeld: Geben Sie das Stichwort ein, das auf das Ticket angewendet werden soll (z. B. Erdnussallergien).
6. Klicken Sie unten auf der Seite auf Auslöser erstellen.

Wenn jetzt das Web Widget auf der in Schritt 4 angegebenen Seite aufgerufen und ein Ticket eingereicht wird, weist dieses Ticket das Stichwort „Erdnussallergien“ auf.

Ablauf des Endbenutzererlebnisses

Im Widget können Sie durch Aktivierung unterschiedlicher Komponenten die Suche in der Wissensdatenbank mit Live-Chat und Kontaktformular kombinieren.

Dem Endbenutzer wird nur jeweils eine Option präsentiert. Die Reihenfolge, in der die Optionen im Widget erscheinen, hängt davon ab, welche Optionen Sie für das Widget aktiviert haben und (bei Chat) ob Agenten online sind.

1. Suche in der Wissensdatenbank. Wenn Sie im Widget das Help Center aktiviert haben, erhält der Endbenutzer zuerst die Möglichkeit, die Wissensdatenbank zu durchsuchen. Dadurch soll das Einreichen von Tickets so weit wie möglich verhindert werden. Der Kunde kann einen Suchbegriff eingeben, zu dem die führenden drei Ergebnisse erscheinen (sofern Übereinstimmungen gefunden werden). Wenn es mehr als drei Übereinstimmungen gibt, kann der Endbenutzer auf die Schaltfläche „Mehr anzeigen“ klicken. Daraufhin erscheinen bis zu neun Beiträge. In der Ergebnisliste kann der Endbenutzer auf den Titel eines Beitrags klicken, der dann im Widget geöffnet wird.

   

   Hinweis: Die Schaltfläche „Mehr anzeigen“ kann durch Änderung der API aus dem Widget entfernt werden. Weitere Informationen finden Sie unter Ausblenden der Schaltfläche „Mehr anzeigen“.
   Wenn die Option Kontexthilfe aktiviert ist, erscheinen unter dem Suchfeld bis zu drei vorgeschlagene Beiträge. Die Beitragsvorschläge basieren auf der Seite, von der aus der Endbenutzer auf das Widget zugegriffen hat.

   

2. Live-Chat. Zendesk Chat erscheint in den folgenden Fällen:
   • Das Help Center ist nicht aktiviert bzw. wurde dem Benutzer bereits präsentiert und
   • Zendesk Chat ist aktiviert und Agenten sind online.

   Wenn Zendesk Chat für das Widget aktiviert ist und Agenten online sind, hat der Endbenutzer die Möglichkeit, einen Live-Chat zu starten.

   

   Wenn der Endbenutzer auf Live-Chat klickt, kann er seine Informationen eingeben und dann mit einem Agenten chatten.

   

3. Kontaktformular. In den folgenden Fällen sehen Kunden das Kontaktformular, damit sie ein Ticket einreichen können:
   • Das Help Center ist nicht aktiviert bzw. wurde dem Benutzer bereits präsentiert und
   • Zendesk Chat ist nicht aktiviert oder Agenten sind nicht online und
   • das Kontaktformular ist aktiviert.

   Wenn Zendesk Chat im Widget nicht aktiviert ist oder keine Agenten online sind, haben Endbenutzer die Möglichkeit, eine Nachricht zu hinterlassen. Dadurch wird ein Ticket erstellt.

   

   Wenn Endbenutzer auf Nachricht hinterlassen klicken, werden sie aufgefordert, die erforderlichen Informationen einzugeben und bei Bedarf Anhänge hinzuzufügen. Danach wird ein Ticket eingereicht.

   

   Hinweis: Durch Modifizieren der API können Sie die Anhangsfunktion deaktivieren. Weitere Informationen finden Sie unter Deaktivieren von Ticketanhängen.

Optimieren von Help-Center-Bildern für das Widget

Damit die in Help-Center-Beiträgen enthaltenen Bilder im Web Widget korrekt angezeigt werden, müssen die Bilder in der richtigen Größe zum jeweiligen Beitrag hinzugefügt werden.

Wenn Help-Center-Beiträge zur Darstellung im Web Widget konvertiert werden, werden die Attribute in den HTML-Tags (bis auf die Attribute „src“ und „alt“) entfernt und angepasste CSS-Regeln ignoriert. Bei den meisten Bildern ist dies kein Problem. Wenn die Originalbilder aber übermäßig groß sind und zur Darstellung im Help Center anhand von HTML- oder angepassten CSS-Code stark verkleinert werden, kann es vorkommen, dass sie im Web Widget viel zu groß erscheinen.

Angenommen, Sie möchten ein Symbol in einem Help-Center-Beitrag anzeigen. Die Originalgröße der Symbolgrafik beträgt 300x300 Pixel. Damit das Symbol im Help Center entsprechend verkleinert wird, werden die folgenden Attribute zum HTML-Code hinzugefügt: width=“6%” height=“6%”.

Im Help-Center-Beitrag wird das Symbol daraufhin im Format 18x18 Pixel dargestellt (6 % der ursprünglichen Größe). Wenn der Beitrag dann aber zur Darstellung im Web Widget aufbereitet wird und die Breiten- und Höhenattribute entfernt werden, erscheint das Symbol wieder in der Originalgröße, was für das Widget unpassend ist.

Um Probleme dieser Art zu vermeiden, sollten Sie Bilder immer von Anfang an wie gewünscht verkleinern, statt die Größe im HTML- oder CSS-Code zu manipulieren.

Entfernen des Widgets von Ihrer Website bzw. aus Ihrem Help Center

Sie können einzelne Instanzen des Widgets entfernen, indem Sie den Code von der jeweiligen Webseite bzw. aus dem Help Center löschen. Wenn Sie alle Instanzen des Widgets entfernen möchten, können Sie das Widget in Zendesk Support deaktivieren.

So entfernen Sie das Widget aus einer Webseite

• Löschen Sie den Code von der Webseite.

So entfernen Sie das Widget aus Ihrem Help Center

1. Klicken Sie in der Seitenleiste auf das Symbol Admin () und dann auf Kanäle > Widget.
2. Klicken Sie auf die Registerkarte Einrichtung.
3. Klicken Sie auf den Schalter Zu Help Center hinzufügen, um das Widget zu entfernen.

So deaktivieren Sie das Widget, damit es nicht mehr auf Ihrer Website bzw. im Help Center erscheint

1. Klicken Sie in der Seitenleiste auf das Symbol Admin () und dann auf Kanäle > Widget.
2. Klicken Sie auf die Registerkarte Anpassung.
3. Klicken Sie auf die Schalter neben Kontaktformular, Chat und Help Center, damit Aus erscheint.

   Alle drei Widget-Komponenten müssen deaktiviert werden.

   

4. Klicken Sie auf Änderungen speichern.

   Das Widget erscheint jetzt nicht mehr auf Ihrer Website bzw. im Help Center.