]> juplo.de Git - website/commitdiff
CLAUDE.md angelegt: Verzeichnisstruktur, Menü-System und Shortcodes dokumentiert
authorKai Moritz <kai.milan.moritz@googlemail.com>
Wed, 3 Jun 2026 21:17:33 +0000 (21:17 +0000)
committerKai Moritz <kai.milan.moritz@googlemail.com>
Wed, 3 Jun 2026 22:09:18 +0000 (22:09 +0000)
Erstmalige CLAUDE.md für den Theme-Branch mit einer Beschreibung der
Verzeichnisstruktur, des Menü-Systems (Konzept und aktueller Stand) sowie
einer Übersicht aller Shortcodes. Dient als Einstiegspunkt für zukünftige
Arbeiten am Theme.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
CLAUDE.md [new file with mode: 0644]

diff --git a/CLAUDE.md b/CLAUDE.md
new file mode 100644 (file)
index 0000000..28850c6
--- /dev/null
+++ b/CLAUDE.md
@@ -0,0 +1,84 @@
+# CLAUDE.md – Theme `hugo-juplo`
+
+Diese Datei enthält Anweisungen für Claude Code beim Arbeiten mit diesem Theme-Branch (`frontend`).
+
+## Arbeitsregeln
+
+- Das Theme wird separat vom Content-Branch entwickelt.
+- Commits in diesem Repo erhalten zunächst immer die Message `WIP:hugo-juplo-theme` (der Verlauf wird später aufgeräumt).
+- Die `exampleSite` dient zum isolierten Testen des Themes ohne den Content-Branch.
+- Änderungen sollen rückwärtskompatibel sein, solange Theme und Content-Branch noch gleichzeitig entwickelt werden.
+
+## Verzeichnisstruktur
+
+```
+hugo-juplo/
+├── layouts/               ← Hugo-Templates
+│   ├── baseof.html        ← Basis-Template (HTML-Gerüst aller Seiten)
+│   ├── _partials/         ← Wiederverwendbare Partials
+│   │   ├── head.html      ← <head>-Element mit CSS/JS
+│   │   ├── header.html    ← Site-Header (Logo, Slogan)
+│   │   ├── breadcrumb.html ← Standard-Breadcrumb
+│   │   ├── post_meta.html  ← Metadaten für Blog-Artikel
+│   │   ├── terms.html      ← Taxonomie-Terms in der Marginalspalte
+│   │   └── menu/
+│   │       ├── default.html ← Standard-Menü (nutzt tree.html)
+│   │       └── tree.html    ← Rekursives Partial für den Seitenbaum
+│   ├── _shortcodes/       ← Shortcodes für Content-Dateien
+│   │   ├── marginalcontent-html.html ← HTML-Content in Marginalspalte
+│   │   ├── marginalcontent-md.html   ← Markdown-Content in Marginalspalte
+│   │   ├── footerlinks.html          ← Seitenspezifische Footer-Links
+│   │   └── recent-posts.html         ← Liste der neuesten Blog-Artikel
+│   ├── blog/              ← Blog-spezifische Templates
+│   │   ├── section.html   ← Blog-Startseite
+│   │   └── archive/       ← Blog-Archiv-Templates
+│   ├── categories/        ← Kategorie-Templates
+│   ├── tags/              ← Tag-Templates
+│   └── ...                ← Weitere Layouts (section, page, article, taxonomy, term)
+├── assets/scss/           ← SCSS-Quellen
+│   ├── base.scss          ← Basis-Styles (immer geladen)
+│   ├── screen.scss        ← Desktop-Styles
+│   ├── tablet.scss        ← Tablet-Breakpoint
+│   ├── phone.scss         ← Mobil-Breakpoint
+│   ├── tiny.scss          ← Kleinstgeräte
+│   └── print.scss         ← Druck-Styles
+├── content/               ← Struktureller Theme-Content
+│   ├── about/             ← About-Sektion mit Unterseiten
+│   ├── blog/archive/      ← Blog-Archiv-Index
+│   ├── categories/        ← Kategorie-Taxonomy-Index
+│   └── tags/              ← Tag-Taxonomy-Index
+├── static/                ← Statische Assets (JS, vorcompiliertes CSS)
+│   └── js/prettify.js     ← Syntax-Highlighting (Google Code Prettify)
+└── exampleSite/           ← Standalone-Testsite für Theme-Entwicklung
+```
+
+## Menü-System
+
+Das Menü (`nav#nav`) ist bewusst am HTML-Ende platziert und funktioniert gleichzeitig als SEO-Sitemap. Details zum Konzept: siehe CLAUDE.md im Content-Repo.
+
+**Aktueller Stand der Menü-Templates:**
+- `_partials/menu/default.html`: Generisches Menü für nicht-Blog-Seiten (nutzt `tree.html`)
+- `_partials/menu/tree.html`: Rekursives Partial für den Seitenbaum (mit Projects-Sichtbarkeitslogik)
+- Für Blog/Categories/Tags ist der Menü-Block direkt in den jeweiligen Layout-Dateien inline — das ist bewusstes technisches Debt, das konsolidiert werden soll.
+
+**Offene Aufgabe:** Den `menu`-Block aus den Einzeltemplates in ein einziges parametrisiertes Partial auslagern.
+
+## Shortcodes
+
+| Shortcode | Verwendung |
+|---|---|
+| `marginalcontent-html` | Injiziert HTML-Content in die Marginalspalte (über `.Page.Store`) |
+| `marginalcontent-md` | Injiziert Markdown-Content in die Marginalspalte (über `.Page.Store`) |
+| `footerlinks` | Setzt seitenspezifische Footer-Links (überschreibt den Standard-Fallback) |
+| `recent-posts` | Listet die neuesten 5 Blog-Artikel |
+
+## Hugo-Konfiguration (hugo.yaml im Content-Repo)
+
+Relevante Parameter für das Theme:
+
+| Parameter | Zweck |
+|---|---|
+| `params.author.name` | Autorenname für `post_meta.html` |
+| `params.copyrightShort` | Kurzname für Copyright-Zeile im Footer |
+| `params.dateFormat` | Datumsformat für Blog-Artikel (Standard: `":date_long"`) |
+| `mainSections` | Definiert die Hauptsektionen für das Section-Menu |