XED /Restore

Statische Website → Bootstrap-Templates für 3 Plattformen

Erstellt: 2026-03-16 · Aktualisiert: 2026-03-31 Quelle: Strategie-Session XED /Suite Priorität: Mittel · Fällig: nach XED /Restore Live-Test abgeschlossen Pfad: dev/bin/XED-Restore/xed_template.py

Ziel

Ein CLI-Tool das eine statische Website (Output von XED /Restore) analysiert und daraus Bootstrap-basierte Templates für drei Zielplattformen generiert:

XED /Restore → Statische Site auf Disk → xed_template.py → 3 Templates
├── WordPress
├── Ghost
└── Jamstack

Erster Testfall

Quelle: https://web.steirischursprung.at/ (Live-WordPress-Site) Archiv: dev/bin/XED-Restore/archive/www.steirischursprung.at/

Archiv-Daten:
→ 1.348 Dateien, ~100 MB
→ ~80 HTML-Seiten, ~200 CSS/JS, ~1.000+ Bilder
→ Original: WordPress + BeTheme (Mfn) + WooCommerce + RevSlider
→ Kein Bootstrap im Original — wird bei der Konversion eingeführt

Warum Bootstrap als gemeinsame Basis?

Das Original-Theme (BeTheme/Mfn) ist proprietär, schwer wartbar und an WordPress gebunden. Bootstrap als Basis bietet:

Vorteil	Beschreibung
Plattform-unabhängig	Gleiche CSS-Klassen in WordPress, Ghost und Jamstack
Wartbar	Jeder Webentwickler kennt Bootstrap
Responsive	Mobile-first Grid, keine eigenen Breakpoints nötig
Dokumentiert	https://getbootstrap.com/docs/
Schlank	Nur die genutzten Komponenten, kein BeTheme-Ballast

Die drei Zielplattformen

1. WordPress-Template

Output: wp-theme/steirischursprung/
├── style.css ← Bootstrap + Custom CSS + WP Theme-Header
├── functions.php ← Bootstrap Enqueue, Menü, Widget-Areas
├── header.php ← Bootstrap Navbar + wp_head()
├── footer.php ← Bootstrap Footer + wp_footer()
├── index.php ← Blog-Index
├── page.php ← Standard-Seite
├── front-page.php ← Homepage (Hero + Grid)
├── single.php ← Blog-Einzelbeitrag
├── sidebar.php ← Bootstrap Sidebar (wenn vorhanden)
├── 404.php
├── assets/
│ ├── css/custom.css ← Site-spezifische Anpassungen
│ ├── js/custom.js
│ └── img/ ← Theme-Bilder (Logo, Icons)
└── template-parts/
├── content-page.php
└── content-post.php

Import: content.wxr (WordPress eXtended RSS) + wp media import

2. Ghost-Template

Output: ghost-theme/steirischursprung/
├── package.json ← Ghost Theme Manifest
├── default.hbs ← Base Layout (Bootstrap + Ghost head/foot)
├── index.hbs ← Homepage / Post-Liste
├── page.hbs ← Statische Seiten
├── post.hbs ← Blog-Einzelbeitrag
├── partials/
│ ├── header.hbs ← Bootstrap Navbar
│ ├── footer.hbs ← Bootstrap Footer
│ └── sidebar.hbs
├── assets/
│ ├── css/
│ │ ├── bootstrap.min.css
│ │ └── custom.css
│ ├── js/
│ │ ├── bootstrap.bundle.min.js
│ │ └── custom.js
│ └── img/
└── locales/
└── de.json ← Deutsche Übersetzungen

Import: Ghost Content API (JSON) oder Ghost Admin Import

Kein Import nötig — ist direkt deployfähig.

Architektur: 5 Phasen

Phase 1: `analyze` — Layout-Erkennung (gemeinsam für alle 3)

python3 xed_template.py analyze archive/www.steirischursprung.at/

Identisch zur ursprünglichen T010-Beschreibung:

5 repräsentative HTML-Dateien vergleichen
Gemeinsamer Anfang = Header-Block
Gemeinsames Ende = Footer-Block
Sidebar-Erkennung
Menüstruktur aus <nav> extrahieren
Layout-Varianten erkennen

Zusätzlich: Design-Elemente identifizieren:

Farbschema extrahieren (aus CSS: Primär-, Sekundär-, Akzentfarben)
Schriftarten (Google Fonts, lokale Fonts)
Hero/Slider-Bereich (Bilder + Texte)
Logo-Datei identifizieren

Output: analysis.json — wird von allen drei Generatoren gelesen.

Phase 2: `bootstrap` — Bootstrap-Konversion (gemeinsam)

python3 xed_template.py bootstrap archive/www.steirischursprung.at/

Das Original-CSS (BeTheme) wird in Bootstrap-Äquivalente übersetzt:

Original (BeTheme/Mfn)	Bootstrap-Äquivalent
`<div class="container_12">`	`<div class="container">`
`<div class="grid_8">`	`<div class="col-md-8">`
`<nav id="menu">`	`<nav class="navbar navbar-expand-lg">`
Custom responsive CSS	Bootstrap Grid + Utilities
RevSlider	Bootstrap Carousel
`<aside class="sidebar">`	`<div class="col-md-4">`

Output:

bootstrap-base/header.html — Bootstrap Navbar mit Original-Menüstruktur
bootstrap-base/footer.html — Bootstrap Footer
bootstrap-base/custom.css — Site-spezifische Farben/Fonts über Bootstrap-Variablen
bootstrap-base/content/ — Extrahierter Content pro Seite (reines HTML)

Phase 3a: `generate --target wordpress`

Nimmt bootstrap-base/ und erzeugt WordPress-Theme:

HTML → PHP mit WordPress Template Tags
Menü → wp_nav_menu()
Content → WXR-Export
Bilder → Media-Mapping

Phase 3b: `generate --target ghost`

Nimmt bootstrap-base/ und erzeugt Ghost-Theme:

HTML → Handlebars (.hbs) mit Ghost Helpers
Menü → {{navigation}}
Content → Ghost JSON-Import
Bilder → Ghost Content API Upload

Phase 3c: `generate --target jamstack`

Nimmt bootstrap-base/ und erzeugt Jamstack-Site:

HTML → Includes/Partials
Content → Markdown mit Frontmatter
Menü → _data/navigation.yml
Direkt deployfähig (Netlify, Vercel, GitHub Pages)

Phase 4: `import` (plattformspezifisch)

# WordPress (braucht WP-CLI)
python3 xed_template.py import --target wordpress --wp-path /var/www/site/htdocs/

# Ghost (braucht Ghost Admin API)
python3 xed_template.py import --target ghost --ghost-url http://localhost:2368 --ghost-key abc123

# Jamstack (kein Import nötig, direkt deployen)
cd jamstack/steirischursprung && npx @11ty/eleventy --serve

CLI-Interface

usage: xed_template.py [-h] {analyze,bootstrap,generate,import,all} ...

Subcommands:
analyze Statische Site analysieren (Layout, Menü, Farben, Assets)
bootstrap Bootstrap-Konversion der Layout-Blöcke
generate Template für Zielplattform generieren
import Content in Zielplattform importieren
all Vollständiger Durchlauf (analyze → bootstrap → generate)

Generate arguments:
--target wordpress | ghost | jamstack (Pflicht)
--bootstrap-ver Bootstrap-Version (Default: 5.3)

Common arguments:
SITE_DIR Pfad zur statischen Site
-o DIR Output-Verzeichnis (Default: ./templates/)
-v, --verbose Detaillierte Ausgabe
--dry-run Nur analysieren, nichts schreiben

Typischer Workflow:

# Alles auf einmal für alle drei Plattformen
python3 xed_template.py all archive/www.steirischursprung.at/ --target wordpress
python3 xed_template.py all archive/www.steirischursprung.at/ --target ghost
python3 xed_template.py all archive/www.steirischursprung.at/ --target jamstack

# Oder schrittweise
python3 xed_template.py analyze archive/www.steirischursprung.at/
python3 xed_template.py bootstrap archive/www.steirischursprung.at/
python3 xed_template.py generate --target wordpress archive/www.steirischursprung.at/
python3 xed_template.py generate --target ghost archive/www.steirischursprung.at/
python3 xed_template.py generate --target jamstack archive/www.steirischursprung.at/

Prinzipien

Stdlib only — wie alle XED-Tools, keine externen Dependencies
Bootstrap als gemeinsame Basis — ein Design, drei Plattformen
Kein CMS nötig für Phase 1-3 — Template-Generierung ist reines Python
80/20-Regel — funktionierendes Template in Minuten, Feinschliff manuell
dev/lib/ wiederverwenden — content_cleaner.py, state_tracker.py

Neue Module (Kandidaten für dev/lib/)

Modul	Zweck
`layout_analyzer.py`	Header/Footer/Sidebar-Extraktion via Byte-Vergleich
`bootstrap_converter.py`	CSS-Klassen → Bootstrap-Äquivalente
`wxr_writer.py`	WordPress WXR XML-Generierung
`ghost_exporter.py`	Ghost JSON Content-Export
`markdown_exporter.py`	HTML → Markdown mit Frontmatter

Schwierige Bereiche

Problem	Strategie
BeTheme Grid → Bootstrap Grid	Mapping-Tabelle für häufige Klassen, Rest manuell
RevSlider → Bootstrap Carousel	Nur Bilder + Texte übernehmen, keine Animationen
WooCommerce-Produkte	Als statische Seiten, kein Shop-Funktionalität
Kontaktformulare	WordPress: Contact Form 7, Ghost: Custom, Jamstack: Formspree
Responsive Breakpoints	Bootstrap-eigene Breakpoints (sm/md/lg/xl), nicht BeTheme
Farben/Fonts	Aus Original-CSS extrahieren → Bootstrap SCSS Variablen

Bezug zur XED /IDE Strategie

Dieses Tool ist der technische Kern des Content-Modus aus der XED /IDE Strategie v2:

Statische Website (XED /Restore)
↓ xed_template.py
Bootstrap-Template (WordPress | Ghost | Jamstack)
↓ XED /IDE Content-Modus
Bearbeitung + KI-gestützte Content-Erstellung
↓ Hosting@ Deploy
Live auf cBUZZ.IO / eigenem Server

Dokument	Pfad
XED /Restore README	`dev/bin/XED-Restore/README.md`
XED /Restore DEVELOPMENT	`dev/bin/XED-Restore/DEVELOPMENT.md`
Testdaten (Archiv)	`dev/bin/XED-Restore/archive/www.steirischursprung.at/`
Live-Referenz	https://web.steirischursprung.at/
XED /IDE Strategie v2	`dev/bin/XED-IDE/XED-IDE_Strategie-v2.md`
XED /IDE Claude Code Vergleich	`dev/bin/XED-IDE/Claude-Code_im_Zed-Editor.md`

XED /Restore

Statische Website → Bootstrap-Templates für 3 Plattformen

Ziel

Erster Testfall

Warum Bootstrap als gemeinsame Basis?

Die drei Zielplattformen

1. WordPress-Template

2. Ghost-Template

3. Jamstack Static Site

Architektur: 5 Phasen

Phase 1: `analyze` — Layout-Erkennung (gemeinsam für alle 3)

Phase 2: `bootstrap` — Bootstrap-Konversion (gemeinsam)

Phase 3a: `generate --target wordpress`

Phase 3b: `generate --target ghost`

Phase 3c: `generate --target jamstack`

Phase 4: `import` (plattformspezifisch)

CLI-Interface

Prinzipien

Neue Module (Kandidaten für dev/lib/)

Schwierige Bereiche

Bezug zur XED /IDE Strategie

Verwandte Dokumente

Statische Website → Bootstrap-Templates für 3 Plattformen

Ziel

Erster Testfall

Warum Bootstrap als gemeinsame Basis?

Die drei Zielplattformen

1. WordPress-Template

2. Ghost-Template

3. Jamstack Static Site

Architektur: 5 Phasen

Phase 1: analyze — Layout-Erkennung (gemeinsam für alle 3)

Phase 2: bootstrap — Bootstrap-Konversion (gemeinsam)

Phase 3a: generate --target wordpress

Phase 3b: generate --target ghost

Phase 3c: generate --target jamstack

Phase 4: import (plattformspezifisch)

CLI-Interface

Prinzipien

Neue Module (Kandidaten für dev/lib/)

Schwierige Bereiche

Bezug zur XED /IDE Strategie

Verwandte Dokumente

Phase 1: `analyze` — Layout-Erkennung (gemeinsam für alle 3)

Phase 2: `bootstrap` — Bootstrap-Konversion (gemeinsam)

Phase 3a: `generate --target wordpress`

Phase 3b: `generate --target ghost`

Phase 3c: `generate --target jamstack`

Phase 4: `import` (plattformspezifisch)