# Claude Code Auftrag — Blog-Integration in obeco.de ## Pflichtlektüre zuerst Bitte lies zuerst: 1. `C:\Daten\RedesignObeco\PROJEKT-STATUS.md` — obeco.de Struktur, CSS-Klassen, Deployment 2. `C:\MoniBase\Anwendungen\Blog-Redesign\PROJEKT.md` — Blog-Projekt Stand --- ## Ziel Den Ghost-Blog (lokal auf LXC 108, http://192.168.2.196:2368/) als statische HTML-Seiten in die obeco.de Website integrieren. Ergebnis: obeco.de/blog/ im obeco.de Design. --- ## Aufgabe 1 — Ghost per wget spiegeln Auf LXC 108 (SSH: [email protected]) folgendes ausführen: ```bash apt install -y wget mkdir -p /tmp/ghost-export cd /tmp/ghost-export wget --mirror \ --convert-links \ --adjust-extension \ --no-host-directories \ --page-requisites \ http://192.168.2.196:2368/ echo "Export fertig" ls -la /tmp/ghost-export/ ``` Danach den Ordner /tmp/ghost-export/ auf Windows nach C:\Daten\RedesignObeco\blog-export\ kopieren (per SCP). --- ## Aufgabe 2 — blog.html erstellen Datei C:\Daten\RedesignObeco\blog.html erstellen im obeco.de Template. Anforderungen: - Identische Nav wie alle anderen Seiten (inkl. Dropdown, Burger-Menü) - Blog in Nav als aktiver Link (kein nav-ext mehr, da lokal) - Page-Banner: Petrol-Hintergrund, Zurueck-Link zur Startseite, H1: "Aus der Praxis" - Unterzeile: "Einblicke aus dem Arbeitsalltag — IT, Software und was sonst noch anfällt." - Identischer Footer wie alle anderen Seiten - Blog-Posts als Kacheln (.card aus style.css) — Titel, Datum, Kurztext, "Weiterlesen" - Posts sortiert: neu nach alt - Responsiv (bestehende Breakpoints aus style.css) CSS: Nur style.css verwenden — keine neue CSS-Datei. --- ## Aufgabe 3 — Einzelartikel-Template Unterordner C:\Daten\RedesignObeco\blog\ anlegen. Pro Blog-Post eine HTML-Datei im obeco.de Template: - Identische Nav + Footer - Page-Banner: Petrol, Titel des Posts, Datum, Zurueck-Link zu blog.html - Inhalt: Post-Text aus Ghost-Export - Dateiname: Slug aus Ghost (z.B. blog/dokumentation-vom-feinsten.html) Hinweis: Zunächst nur die 5 neuesten Posts als Einzelartikel umwandeln. --- ## Aufgabe 4 — obeco-policom-weblog.html anpassen Datei C:\Daten\RedesignObeco\obeco-policom-weblog.html: - iframe auf blogspot.com entfernen - Redirect auf blog.html einbauen: meta http-equiv="refresh" content="0; url=blog.html" --- ## Aufgabe 5 — Nav-Link in allen HTML-Dateien aktualisieren In allen HTML-Dateien unter C:\Daten\RedesignObeco\ den Blog-Nav-Link ändern: Vorher: a href="obeco-policom-weblog.html" class="nav-ext" > Blog Nachher: a href="blog.html" > Blog --- ## Aufgabe 6 — Lokale Vorschau testen ```powershell npx serve -l 3000 C:\Daten\RedesignObeco ``` Prüfen: - blog.html lädt korrekt - Posts werden angezeigt - Einzelartikel öffnen - Nav-Link Blog funktioniert - Footer korrekt --- ## Aufgabe 7 — Upload zu Host Europe per WinSCP Nach erfolgreichem lokalem Test hochladen: - blog.html - blog/ (Ordner mit Einzelartikeln) - obeco-policom-weblog.html - alle HTML-Dateien mit geändertem Nav-Link WinSCP: C:\Program Files (x86)\WinSCP\WinSCP.com FTP-Host: 92.205.93.96 Benutzer: [email protected] Passwort: im Hoster-Panel nachschauen --- ## Abschluss Alle Schritte protokollieren. Fehler melden. Nach Upload: https://www.obeco.de/blog.html im Browser prüfen. Ergebnis in C:\MoniBase\Anwendungen\Blog-Redesign\PROJEKT.md dokumentieren.