So erstellen und passen Sie Zendesk Guide Abschnittsseitenvorlagen an

Wenn Sie ein Hilfezentrum mit Hunderten von Artikeln verwalten, haben Sie wahrscheinlich festgestellt, dass es keine Einheitslösung gibt. Ein Abschnitt zur Fehlerbehebung benötigt ein anderes Layout als ein Abschnitt zur Produktdokumentation. Hier kommen Zendesk Guide Abschnittsseitenvorlagen ins Spiel. Mit ihnen können Sie das Aussehen und die Funktion Ihrer Abschnittsseiten anpassen und Besuchern ein besseres Browsing-Erlebnis bieten, das auf der Art der Inhalte basiert, die sie sich ansehen.

Dieser Leitfaden führt Sie durch alles, was Sie über das Erstellen und Anpassen von Abschnittsseitenvorlagen wissen müssen. Egal, ob Sie den Theme-Editor bevorzugen oder direkt mit Code arbeiten, Sie lernen beide Ansätze mit praktischen Beispielen, die Sie noch heute umsetzen können.

Abschnittsseitenvorlagen verstehen

Standard- vs. benutzerdefinierte Vorlagen

Jedes Zendesk-Hilfezentrum beginnt mit einer Standard-Abschnittsseitenvorlage. Diese Vorlage zeigt den Abschnittsnamen, die Beschreibung und eine Liste von Artikeln in einem Standardlayout an. Sie funktioniert gut für grundlegende Anforderungen, behandelt aber alle Abschnitte auf die gleiche Weise.

Mit benutzerdefinierten Abschnittsseitenvorlagen können Sie:

• Das Layout und die visuelle Hierarchie ändern
• Hervorgehobene Artikel anders hervorheben
• Benutzerdefinierte Navigationselemente hinzufügen
• Abschnittsspezifische CTAs erstellen
• Die Anzeige basierend auf dem Inhaltstyp anpassen

Wann Sie benutzerdefinierte Abschnittsseitenvorlagen verwenden sollten

Erwägen Sie das Erstellen benutzerdefinierter Vorlagen, wenn:

• Sie verschiedene Inhaltstypen haben, die unterschiedliche Präsentationen benötigen (FAQs vs. Tutorials vs. Fehlerbehebung)
• Bestimmte Abschnitte eine eindeutige Navigation oder Querverlinkung benötigen
• Sie hervorgehobene Artikel in bestimmten Abschnitten deutlicher hervorheben möchten
• Die Branding-Anforderungen in verschiedenen Teilen Ihres Hilfezentrums variieren
• Sie abschnittsspezifische Widgets oder Inhalte von Drittanbietern integrieren müssen

Wie Abschnittsseiten in die Hierarchie passen

Zendesk Guide organisiert Inhalte in einer dreistufigen Hierarchie:

1. Kategorien – Container der obersten Ebene (ausgeblendet, wenn Sie nur eine haben)
2. Abschnitte – enthalten verwandte Artikel
3. Artikel – einzelne Inhaltsstücke

In Enterprise-Plänen können Abschnitte auch Unterabschnitte enthalten, wodurch bis zu fünf Verschachtelungsebenen mit maximal 200 Abschnitten pro übergeordnetem Element möglich sind. Diese Flexibilität ist nützlich für komplexe Wissensdatenbanken, erfordert jedoch ein durchdachtes Vorlagendesign.

Methode 1: Erstellen von Vorlagen im Theme-Editor

Der Theme-Editor bietet eine visuelle Oberfläche zum Erstellen von Vorlagen, ohne Dateien herunterzuladen. So verwenden Sie ihn.

Schritt 1: Navigieren Sie zur Wissensverwaltung

Gehen Sie in Ihrem Zendesk-Adminbereich zu Wissensverwaltung und klicken Sie dann in der Seitenleiste auf Design anpassen. Ihre Themes werden auf der Seite Themes angezeigt.

Schritt 2: Bearbeiten Sie Ihren Theme-Code

Suchen Sie das Theme, das Sie anpassen möchten, und klicken Sie auf Anpassen. Klicken Sie dann auf Code bearbeiten, um auf die Vorlagendateien zuzugreifen.

Schritt 3: Fügen Sie eine neue Abschnittsvorlage hinzu

Klicken Sie im Bereich Dateien auf Neu hinzufügen und wählen Sie dann im Dropdown-Menü Abschnittsvorlage aus.

Schritt 4: Konfigurieren Sie Ihre Vorlage

Sie müssen Folgendes angeben:

• Vorlagenname – Verwenden Sie snake_case (Kleinbuchstaben mit Unterstrichen), maximal 25 Zeichen. Beispiel: video_section oder faq_layout
• Starten von – Wählen Sie entweder eine leere Vorlage oder kopieren Sie eine vorhandene Vorlage als Ausgangspunkt

Schritt 5: Bearbeiten Sie den Vorlagencode

Die neue Vorlage wird im Code-Editor geöffnet. Hier schreiben Sie Ihren HTML- und Curlybars-Code. Der Editor enthält Syntaxhervorhebung und automatische Speicherfunktion.

Klicken Sie auf Vorschau, um zu sehen, wie Ihre Vorlage mit Live-Daten aussieht, und dann auf Speichern, wenn Sie zufrieden sind.

Schritt 6: Wenden Sie die Vorlage auf Abschnitte an

Sobald Ihre Vorlage gespeichert und Ihr Theme live ist, navigieren Sie zu einem beliebigen Abschnitt in Ihrem Hilfezentrum. Klicken Sie auf Abschnitt bearbeiten und wählen Sie Ihre benutzerdefinierte Vorlage im Dropdown-Menü Vorlage in der Seitenleiste aus.

Klicken Sie auf Aktualisieren, um die Vorlage anzuwenden. Die Änderung wird sofort auf der Live-Abschnittsseite wirksam.

Methode 2: Erstellen von Vorlagen lokal

Für Entwickler, die es vorziehen, in ihrer eigenen Umgebung zu arbeiten, können Sie Vorlagen lokal erstellen und importieren.

Schritt 1: Laden Sie Ihr Theme herunter

Klicken Sie auf der Seite Themes im Optionsmenü Ihres Themes auf Herunterladen. Dadurch erhalten Sie eine ZIP-Datei mit allen Theme-Dateien.

Schritt 2: Erstellen Sie den Ordner section_pages

Extrahieren Sie die ZIP-Datei und navigieren Sie zum Verzeichnis templates. Erstellen Sie einen neuen Ordner namens section_pages, falls er noch nicht vorhanden ist.

Schritt 3: Fügen Sie Ihre Vorlagendatei hinzu

Erstellen Sie eine neue Datei mit der Erweiterung .hbs im Ordner section_pages. Der Dateiname muss:

• Verwenden Sie snake_case (Kleinbuchstaben mit Unterstrichen)
• 25 Zeichen oder weniger sein
• Nur Buchstaben, Zahlen und Unterstriche enthalten

Beispiel-Dateinamen: video_gallery.hbs, faq_accordion.hbs, featured_top.hbs

Schritt 4: Schreiben Sie Ihren Vorlagencode

Hier ist eine grundlegende Struktur, um Ihnen den Einstieg zu erleichtern:

<nav class="sub-nav">
  {{breadcrumbs}}
  {{subscribe}}
</nav>

<h1>{{section.name}}</h1>
<p class="section-description">{{section.description}}</p>

{{#if promoted_articles}}
  <div class="promoted-articles">
    <h2>Hervorgehobene Artikel</h2>
    <ul>
      {{#each promoted_articles}}
        <li><a href="{{url}}">{{title}}</a></li>
      {{/each}}
    </ul>
  </div>
{{/if}}

{{#if section.articles}}
  <ul class="article-list">
    {{#each section.articles}}
      <li class="article">
        <a href="{{url}}">{{title}}</a>
      </li>
    {{/each}}
  </ul>
{{else}}
  <p>Noch keine Artikel in diesem Abschnitt.</p>
{{/if}}

{{pagination}}

Schritt 5: Importieren Sie Ihr Theme

Zippen Sie den geänderten Theme-Ordner und kehren Sie zu Zendesk zurück. Klicken Sie auf Theme hinzufügen > Importieren und laden Sie Ihre ZIP-Datei hoch. Zeigen Sie eine Vorschau des Themes an, um zu überprüfen, ob Ihre Vorlagen korrekt funktionieren, und veröffentlichen Sie es dann, um es live zu schalten.

Code-Referenz für Abschnittsseitenvorlagen

Das Verständnis der verfügbaren Eigenschaften und Helfer ermöglicht es Ihnen, anspruchsvollere Vorlagen zu erstellen.

Verfügbare Eigenschaften

Quelle: Zendesk Developer Docs

Verfügbare Helfer

Häufige Muster

Schleife durch Artikel mit Metadaten:

{{#each section.articles}}
  <article class="article-item">
    <h3><a href="{{url}}">{{title}}</a></h3>
    <p class="meta">
      Aktualisiert {{date updated_at timeago=true}}
      {{#if author}}
        von {{author.name}}
      {{/if}}
    </p>
  </article>
{{/each}}

Bedingter Inhalt basierend auf dem Benutzerstatus:

{{#if signed_in}}
  <p>Willkommen zurück! {{user.name}}</p>
{{else}}
  <p><a href="{{signin_url}}">Anmelden</a> für personalisierte Hilfe.</p>
{{/if}}

Best Practices für das Design von Abschnittsseiten

Halten Sie die Navigation intuitiv

Fügen Sie immer Breadcrumbs hinzu, damit Benutzer verstehen, wo sie sich in Ihrer Hilfezentrum-Hierarchie befinden. Der {{breadcrumbs}}-Helfer erledigt dies automatisch, aber stellen Sie sicher, dass er sichtbar ist und konsistent mit Ihrer Marke gestaltet ist.

Verwenden Sie hervorgehobene Artikel strategisch

Hervorgehobene Artikel werden oben auf den Abschnittsseiten angezeigt. Verwenden Sie sie, um Folgendes hervorzuheben:

• Am häufigsten aufgerufene Inhalte
• Anleitungen für den Einstieg
• Kritische Schritte zur Fehlerbehebung
• Kürzlich aktualisierte wichtige Artikel

Berücksichtigen Sie die mobile Reaktionsfähigkeit

Testen Sie Ihre Vorlagen auf mobilen Geräten. Abschnittsseiten mit vielen Artikeln können auf kleinen Bildschirmen unhandlich werden. Erwägen Sie zusammenklappbare Abschnitte oder Akkordeon-Layouts für lange Artikellisten.

Behalten Sie ein konsistentes Branding bei

Während Sie mit benutzerdefinierten Vorlagen Layouts variieren können, sollten Sie Farben, Schriftarten und Abstände konsistent mit Ihrem Gesamtthema halten. Benutzer sollten das Gefühl haben, sich im selben Hilfezentrum zu befinden, auch wenn sich die Abschnittslayouts unterscheiden.

Testen Sie mit unterschiedlichen Artikelmengen

Eine Vorlage, die mit 5 Artikeln gut aussieht, kann mit 50 Artikeln fehlschlagen. Testen Sie Ihre Vorlagen mit verschiedenen Inhaltsmengen, um sicherzustellen, dass sie entsprechend skaliert werden.

Behebung häufiger Probleme

Vorlage wird nicht im Dropdown-Menü angezeigt

Die häufigste Ursache: Ihr Theme ist nicht live. Benutzerdefinierte Vorlagen werden nur in der Vorlagenauswahl angezeigt, wenn das Theme, das sie enthält, das aktive Live-Theme ist. In Suite Growth und Professional können Sie mehrere Vorlagen in einem nicht-live Theme erstellen, um sie zu testen, aber Sie können sie erst anwenden, wenn das Theme live geht.

Änderungen werden nicht sofort übernommen

Zendesk speichert Hilfezentrum-Seiten zur Leistungssteigerung zwischen. Wenn Sie keine Vorlagenänderungen sehen:

• Leeren Sie Ihren Browser-Cache
• Probieren Sie ein Inkognito-/Privatfenster aus
• Warten Sie einige Minuten, bis der CDN-Cache aktualisiert wird

Berechtigungsfehler

Nur Wissensadministratoren können Vorlagen erstellen und auf Abschnitte anwenden. Agenten können Vorlagen für einzelne Artikel ändern, die sie bearbeiten dürfen, aber Abschnitts- und Kategorienvorlagenänderungen erfordern Administratorzugriff.

Fehler bei der Vorlagenbenennung

Wenn Ihre Vorlage nicht gespeichert wird, überprüfen Sie Folgendes:

• Der Name verwendet nur Kleinbuchstaben, Zahlen und Unterstriche
• Der Name ist 25 Zeichen oder weniger
• Keine Leerzeichen oder Sonderzeichen

Verwenden von KI zur Optimierung Ihrer Wissensdatenbank

Das Erstellen benutzerdefinierter Vorlagen ist nur ein Teil des Aufbaus eines effektiven Hilfezentrums. Die eigentliche Herausforderung besteht darin, Ihre Inhalte organisiert, auf dem neuesten Stand und leicht zu finden zu halten. Hier können KI-Teamkollegen helfen.

Bei eesel AI gehen wir das Wissensmanagement anders an. Anstatt KI als ein Tool zu behandeln, das Sie konfigurieren, betrachten wir sie als einen Teamkollegen, den Sie einstellen. Unsere KI lernt Ihr Geschäft aus Ihren vorhandenen Inhalten (vergangene Tickets, Hilfezentrum-Artikel, Makros und verbundene Dokumente wie Confluence oder Notion) und hilft Ihnen, Lücken in Ihrer Wissensdatenbank zu identifizieren.

So funktioniert es: Verbinden Sie eesel AI mit Ihrem Helpdesk, und es analysiert sofort Ihre Inhalte. Es identifiziert, welche Artikel funktionieren, welche Aktualisierungen benötigen und was vollständig fehlt. Sie können Simulationen auf vergangene Tickets ausführen, um zu sehen, wie gut Ihre Wissensdatenbank häufige Fragen beantworten würde, und dann die Lücken füllen, bevor Kunden auf sie stoßen.

Das Teamkollegenmodell bedeutet, dass Sie mit Anleitung beginnen (eesel entwirft Antworten zur Überprüfung) und basierend auf der tatsächlichen Leistung zu einem autonomen Betrieb übergehen (eesel übernimmt den Frontline-Support direkt). Sie steuern das Tempo basierend auf dem, was Sie funktionieren sehen.

Wenn Sie Zeit in benutzerdefinierte Abschnittsseitenvorlagen investieren, um die Benutzererfahrung zu verbessern, sollten Sie überlegen, was ein KI-Teamkollege für die Inhalte tun könnte, die hineingehören. Die Kombination aus gut strukturierten Vorlagen und kontinuierlich optimierten Inhalten schafft ein Hilfezentrum, das tatsächlich hilft.