Files

JUSN 6e83768b8c Landingpage-Template v1: config-gesteuert, zwei Themes (papier/clean)

- config.js: alle Inhalte an einer Stelle (Marke, SEO, Farben, Hero,
  Features, Zahlen, Schritte, Warteliste, FAQ, Footer)
- build.js: rendert statisches HTML aus der Config (gut fuer SEO),
  Abschnitte optional, Theme papier/clean, Assets-Kopie
- README mit Anleitung, .gitignore
- BehördenKlar als fertiges Beispiel; node build.js getestet -> dist/index.html

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

2026-08-14 22:43:01 +02:00

2.0 KiB

Raw Blame History

Landingpage-Template

Ein wiederverwendbares Landingpage-Template für neue (SaaS-)Projekte. Du füllst eine Datei aus (config.js) und bekommst eine fertige, schnelle Landingpage als statisches HTML — gut für Google, deploybar überall.

In 3 Schritten zu einer neuen Landingpage

Dieses Repo kopieren (oder als Vorlage klonen).
config.js ausfüllen — Name, Farben, Texte, Features, Warteliste, FAQ … (Das ist die einzige Datei, die du normalerweise anfasst.)
Bauen:
```
node build.js
```
→ erzeugt dist/index.html.

Fertig. Den Ordner dist/ dann auf einen Static-Host hochladen — z. B. Cloudflare Pages (kostenlos):

npx wrangler pages deploy dist --project-name DEIN-PROJEKT

Was ist wo?

Datei	Zweck
`config.js`	Alle Inhalte — hier änderst du alles pro Projekt.
`build.js`	Das Design/Layout. Nur anfassen, wenn du das Aussehen ändern willst.
`dist/`	Das fertige Ergebnis (wird von `build.js` erzeugt).
`assets/`	Favicon, Vorschaubild usw. — wird beim Bauen nach `dist/` kopiert.

Zwei Looks (Theme)

In config.js unter theme:

"papier" — warmer Amtsbrief-/Papier-Stil (Serifenschrift, Textur, §-Nummern, Stempel). Der BehördenKlar-Look.
"clean" — schlicht/modern (serifenlos, glatte Fläche, abgerundete Karten).

Die vier Farben unter colors bestimmen in beiden Themes den Look.

Abschnitte

Alle Abschnitte sind optional — leer lassen ([] oder ""), und sie verschwinden automatisch:

Hero — Überschrift, Text, bis zu zwei Knöpfe, Stempel
Features — Vorteils-Karten
Zahlen — Vertrauens-/Statistik-Karten
So funktioniert es — nummerierte Schritte
Warteliste — Anmeldeformular (z. B. Brevo) oder Mailto-Knopf
FAQ — aufklappbare Fragen
Footer — Links + Hinweis

Voraussetzung

Nur Node.js (für node build.js). Kein weiteres Setup, keine Abhängigkeiten.

2.0 KiB Raw Blame History