feat: Divi hints point to the read tools; guides divi-structure/attrs/design-system; test: Divi read end-to-end

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01At3V6SjwbMe6eMzVGW3Hs7
This commit is contained in:
2026-09-26 12:41:42 +02:00
co-authored by Claude Opus 5.5
parent b3cd0eee62
commit f433fef8f7
15 changed files with 326 additions and 19 deletions
+32
View File
@@ -0,0 +1,32 @@
# Divi-Einstellungen (Vollform)
Jedes Divi-5-Modul speichert seine Einstellungen unter **Attributpfaden**, z. B.
- `title.innerContent` – Text der Überschrift,
- `title.decoration.font.font` – Schrift der Überschrift (Farbe, Größe, Ebene `headingLevel`),
- `button.innerContent` – Beschriftung und Link eines Buttons (`text`, `linkUrl`, `linkTarget`),
- `module.decoration.background` – Hintergrund, `module.decoration.spacing` – Innen-/Außenabstand,
- `module.meta.adminLabel` – Admin-Label im Divi-Builder.
Der Wert eines Pfads ist eine Zuordnung **Breakpoint → Zustand → Wert**:
```json
{ "desktop": { "value": { "color": "#1a1a1a", "headingLevel": "h2" }, "hover": { "color": "#000000" } },
"phone": { "value": { "size": "28px" } } }
```
Breakpoints: `desktop`, `tablet`, `phone` (je nach Website auch `tabletWide`, `phoneWide`, `widescreen`,
`ultraWide`); Zustände: `value`, `hover`, `sticky`.
## Pfade finden
- `lit-divi-catalog` mit `module` (z. B. `"heading"`) listet alle gültigen Pfade dieses Moduls auf dieser
Website (live aus Divi) und die Kurzform-Felder mit ihrem Pfad. `path_kinds` nennt die Feldart eines Pfads
(`text`, `richtext`, `code`, `url`, `image`, `color`, `enum`, `onoff`, `number`, `list`, `icon`), soweit aus
den Divi-Metadaten ableitbar; zusammengesetzte Pfade (mehrere mögliche Feldarten je nach Unterschlüssel)
gelten als unbekannt, statt eine Feldart zu raten.
- `lit-divi-node-get` zeigt die gesetzten Werte eines vorhandenen Knotens in genau dieser Form (`attrs`).
- Schrift-Gruppen liegen eine Ebene tiefer: `…decoration.font.font`, `…decoration.bodyFont.body.font`,
`…decoration.headingFont.h2.font`, `module.advanced.text.text`.
- Werte wie `$variable({…})$` sind Verweise auf globale Farben, Variablen oder dynamische Inhalte – nicht
durch feste Werte ersetzen (siehe `divi-design-system`).