Lantern: eine Produktdokumentation

Lantern ist eine erfundene Open-Source-Suchmaschine, die du selbst hostest. Ihre Dokumentation ist mit dem Rezept Documentation von Leitvia Studio und dem Dokumentations-Template des Themes gebaut, in der Stilvariante Warm Editorial dark mit eigenem Token-Set.

Startseite der Lantern-Dokumentation auf dunklem Ochsenblutrot: das Laternen-Logo und das Menü, die Überschrift „Lantern documentation“ in einer großen Serifenschrift, ein breites Suchfeld und Buttons zu den drei meistgelesenen Seiten
Startseite bei 1440 Pixeln, Stand Oktober 2026

Was die Demo zeigt

  • Ein Seitenbaum aus acht Seiten auf drei Ebenen mit dem Dokumentations-Template des Themes und seiner Seitenleiste
  • Der Block Table of contents auf den langen Seiten, lesbar ohne JavaScript
  • Codebeispiele mit einem Button Copy code, den Studio ergänzt, sobald JavaScript läuft
  • Tabellen, ein Changelog und eine Suche im Header, die als eigener Landmark benannt ist
Die Lantern-Dokumentation auf dem Smartphone: Logo und Suche im Header, die Überschrift, das Suchfeld und die Buttons „Getting started“, „Query syntax“ und „API reference“
Auf dem Smartphone, 390 Pixel breit

Patterns und Blöcke

Ein Such-Hero mit Links zu den drei meistgelesenen Seiten, Story-Highlight, Bento-Features, Testimonial, Schritte, FAQ und ein Handlungsaufruf zum Kontakt.

Blöcke: Table of contents, Bento und Reveal von Studio.

Jedes Pattern liest Farben, Größen und Abstände aus den Rollen des Designvertrags. Deshalb sehen dieselben Abschnitte in jeder Demo anders aus, ohne eine Zeile eigenes CSS.

Eckdaten

  • Marke: Lantern (erfunden), mit Newsreader, IBM Plex Sans und IBM Plex Mono auf Ochsenblutrot und einem Akzent in Laternenrosa
  • Art der Website: Produktdokumentation einer Suchmaschine
  • Gebaut mit: dem Rezept Documentation
  • Tarif: Free.
  • Live-Demo: demo.leitvia.com/docs/

Eine Website wie Lantern bauen

So richtest du sie in drei Schritten auf deiner eigenen Website ein:

  1. Installiere das Theme und Leitvia Studio.
  2. Wende das Rezept Documentation und sein Änderungspaket an.
  3. Lege deine Seiten unterhalb von Documentation mit dem Template Documentation an und füge den Block Table of contents ein, wo eine Seite lang wird.
wp leitvia recipe apply leitvia/documentation --user=admin

Der Skill leitvia-setup wendet das Rezept an; leitvia-maintain repariert später kaputte Links und fehlende Alternativtexte im ganzen Seitenbaum.

Weitere Demos