Hilfe-Funktionen testen (Demo)

Dieser Artikel ist absichtlich umfangreich und enthält alle Helpcenter-Bausteine. Nutze ihn, um Layout, Sidebar, Scrollspy und Interaktionen zu prüfen.

Überblick

Rechts siehst du die moderne Blog-Sidebar mit Inhaltsverzeichnis, Kategorie, Zuletzt besucht, Favoriten und Schnellzugriffen. Beim Scrollen sollte der aktuelle Abschnitt im TOC hervorgehoben werden.

Einleitung und Navigation

Breadcrumbs führen dich zurück zum Hilfe-Center und zur Kategorie. Über die Suche im Hero kannst du ohne Seitenreload weitere Artikel finden – Tastatur: /, Pfeiltasten, Enter.

Was du hier testen kannst

• Sticky Inhaltsverzeichnis (rechts auf Desktop, mobil unter dem Hero)
• Callouts (Tipp, Hinweis, Warnung, Achtung)
• Accordion-FAQ
• Codeblöcke mit Kopieren-Button
• Bilder mit Lightbox
• Verwandte Artikel
• Feedback „Hat dir dieser Artikel geholfen?“
• Teilen, Drucken und Favoriten

Callouts und Hinweise

Bilder und Lightbox

Klicke auf die Bilder, um die Lightbox zu öffnen. Escape oder Klick außerhalb schließt sie.

Codeblöcke

Kopiere den folgenden Befehl über den Button oben rechts im Block:

curl -X GET "https://app.ninjamatic.de/api/v1/status" \
  -H "Authorization: Bearer YOUR_TOKEN" \
  -H "Accept: application/json"

Ein zweites Beispiel in PHP:

<?php
$token = getenv('NINJAMATIC_API_TOKEN');
$ch = curl_init('https://app.ninjamatic.de/api/v1/status');
curl_setopt_array($ch, [
    CURLOPT_RETURNTRANSFER => true,
    CURLOPT_HTTPHEADER => [
        'Authorization: Bearer ' . $token,
        'Accept: application/json',
    ],
]);
$response = curl_exec($ch);
curl_close($ch);
echo $response;

Arbeitsablauf Schritt für Schritt

1. Öffne das Hilfe-Center und suche nach „Demo“.
2. Markiere diesen Artikel als Favorit.
3. Scrolle durch die Abschnitte und beobachte den TOC.
4. Klappe Callouts und FAQ-Einträge.
5. Gib Feedback am Artikelende.

Checkliste für QA

• [ ] Sidebar rechts unter dem Hero
• [ ] TOC-Scrollspy aktiv
• [ ] Lightbox öffnet und schließt
• [ ] Code-Copy funktioniert
• [ ] Feedback speichert lokal
• [ ] Druckansicht blendet Rail aus

Häufige Fragen

Nächste Schritte

• Erste Schritte
• API-Token erstellen
• WordPress verbinden

Wenn etwas nicht wie erwartet wirkt, nutze den Kontaktblock unten oder das Feedback-Formular.