Publii: Clou of themes {6}: Tattoo

Christian Spaan 23.07.2023 Publii

Viele Themes für Publii zeichnen sich durch einen gewissen Clou aus.
Episode 6: Tattoo.

Das kostenlose Theme Tattoo zeichnet sich vor Allem durch den Header-Bereich aus. Während der Webseiten-Titel und das Header-Menü bei den meisten Themes horizontal angeordnet sind (also nebeneinander), erscheint der Webseiten-Titel bei Tattoo oberhalb des Header-Menüs in einer relativ großen Header-Leiste. Beim Zurückscrollen von unteren Bereichen der Webseite wird hingegen ein reduzierter Header-Bereich mit horizontaler Anordnung angezeigt, bis der Anfang der Seite erreicht ist. Dann wird wiederum der volle Header-Bereich mit vertikaler Anordnung angezeigt.

Durch das vertikale Layout bietet es sich an, für die Webseite ein Logo statt eines Texttitels zu verwenden: so bekommt man ein Webseiten-Logo über dem textbasierten Header-Menü anstatt zweier Textzeilen untereinander. Darunter befindet sich ein großes Hero-Image, gefolgt von Kacheln der Posts mit Titel-Overlay.

Ein Webseiten-Logo lässt sich statt des Webseiten-Titels verwenden, indem man unter Theme ein Website logo lädt.

Ein Back-to-Top-Button ist ebenfalls verfügbar.
Die Kacheln werden beim Überfahren mit der Maus hübsch animiert, indem auf die entsprechenden Bilder sowohl ein Zoom als auch eine Verdunkelung angewandt wird.
Unter Theme > Layout > Frontpage layout sollte default (=automatisch) gewählt werden, da es sonst zu Graphiffehlern bei den Kacheln kommen kann (vermutlich ein kleiner Bug).

Ansonsten stehen natürlich die Standard-Features zur Verfügung:

Pros:

Flexibler Header-Bereich mit vertikaler / horizontaler Anordnung
Schicke Kachel-Animationen
Back-to-Top-Button
Exzellentes Design
Keine externen Schriftarten, z.B. Google Fonts
Keine sonstigen vom Theme initiierten Datenübermittlungen
Kostenlos

Cons:

Standardmäßig relativ großer Header-Bereich, der allerdings konfigurierbar ist
Graphikfehler in einigen Kacheln bei Frontpage layout ungleich default
keine weiteren bekannt (Hinweise gern in den Kommentaren)

❣ Pro-Tipp: Lassen Sie sich nicht vom Namen des Theme und dessen Primären Einsatzzweckes abschrecken! Prinzipiell kann jedes Theme allen erdenklichen Einsatzzwecken dienen. Ihrer Kreativität sind keine Grenzen gesetzt!

Ein Theme in Publii installieren

Klicken Sie auf das 3-Punkte-Menü in der oberen rechten Ecke des Hauptbildschirms von Publii und wählen Sie den Eintrag Themes:

Die Schaltfläche Get more themes bringt Sie direkt zur Themes-Seite des Publii Marketplace. Nachdem Sie die Zip-Datei des Theme auf der Themes-Seite des Publii-Marktplatzes heruntergeladen haben, klicken Sie auf die Schaltfläche Theme installieren und wählen Sie die heruntergeladene Zip-Datei aus.