Diese Seite dokumentiert den konkreten technischen Entwicklungsstand des eigenen WordPress-Themes TheCruiserTheme für TheCruiserBlog.

Die Dokumentation wächst zusammen mit der tatsächlichen Entwicklung. Fertiggestellte oder ausreichend stabile Entwicklungsstände werden als Meilensteine festgehalten.

Gestalterische und technische Bereiche, die sich noch in Entwicklung befinden, werden ausdrücklich als offen gekennzeichnet.

Der erste dokumentierte Meilenstein umfasst die Grundstruktur des Headers und die Navigation des TheCruiserTheme.

Der Header ist derzeit grundsätzlich so aufgebaut:

TCB-Logo → TCB-Banner → Hamburger-Menü

Aktueller technischer Stand:

• Das Logo wird über die WordPress-Funktion custom-logo eingebunden.
• Die Höhe des Logos ist derzeit auf 100px begrenzt.
• Das TCB-Banner stammt aus der WordPress-Mediathek.
• Für das Banner existiert im Customizer die eigene Einstellung TCB Header → TCB Banner.
• Unterhalb von 768px wird das Banner ausgeblendet.
• Der Inhalt des Headers ist auf maximal 1200px Breite begrenzt.

Für die Hauptnavigation ist die Menüposition TCB Hauptnavigation registriert.

Die ursprünglich vorgesehene horizontale Navigation wurde während der Entwicklung verworfen. Stattdessen verwendet TheCruiserTheme auf allen Bildschirmgrößen ein Hamburger-Menü.

Beim Öffnen erscheint die Navigation als Panel von rechts.

Aktueller technischer Stand:

• Panelbreite: min(320px, 85vw)
• der Hintergrund wird beim Öffnen abgedunkelt
• die Hintergrundseite kann bei geöffnetem Menü nicht gescrollt werden
• Schließen über ×
• Schließen durch Klick auf das Overlay
• Schließen mit der ESC-Taste

Für Untermenüs wird die vorhandene WordPress-Menühierarchie verwendet.

• Untermenüs sind zunächst geschlossen.
• Sie werden über einen markanten runden Pfeil geöffnet.
• Ein geöffneter Hauptmenüpunkt wird hervorgehoben.
• Beim Schließen des Navigationspanels werden geöffnete Untermenüs zurückgesetzt.

Für TheCruiserTheme ist ein eigener Widgetbereich für die Sidebar eingerichtet.

Aktueller technischer Stand:

• Bezeichnung: TCB Sidebar
• technische ID: tcb-sidebar
• eigene Theme-Datei sidebar.php
• Standardaufteilung: Hauptinhalt mit rechter Sidebar
• Breite der Sidebar: 300px
• unterhalb von 768px werden Hauptinhalt und Sidebar untereinander dargestellt

Die Sidebar ist damit technisch grundsätzlich eingebunden. Die endgültige inhaltliche und gestalterische Ausarbeitung ist noch nicht abgeschlossen.

Für die interaktive Steuerung der Navigation verwendet TheCruiserTheme eine eigene JavaScript-Datei:

assets/js/navigation.js

Die Datei übernimmt derzeit folgende Aufgaben:

• Öffnen und Schließen des Navigationspanels
• Steuerung des Overlays
• Schließen der Navigation über die ESC-Taste
• Sperren des Scrollens der Hintergrundseite bei geöffnetem Navigationspanel
• Öffnen und Schließen der Untermenüs
• Zurücksetzen geöffneter Untermenüs beim Schließen des Navigationspanels

Damit ist die interaktive Navigation von der eigentlichen HTML-Struktur und Gestaltung des Themes getrennt organisiert.