Jetzt neu und frisch, besser vom Niederrhein. 
KLXM Studio – Startseite
Kontakt aufnehmen

Agenturen & Netzwerk · Fortgeschritten · 0:52 Min.

Eigenes Kit mit dem Start-Kit

kit:create kopiert das Start-Kit „starter“ – danach anpassen, bauen, testen.

Ohne Ton, mit Untertiteln Untertitel Deutsch und Englisch – im Player über „CC“ ein- und ausschalten. Das Video liegt auf diesem Server und lädt erst beim Abspielen. Die Schritte unten sind der vollständige Text zum Video.

Ziel

Sie legen für ein Projekt ein eigenes Kit an, das auf dem kleinsten vollständigen Kit aufbaut, und wissen, welche Schritte danach folgen.

Voraussetzungen

  • Zugriff auf die Kommandozeile und den Ordner themes/ (lokal oder auf dem Server).
  • Node/pnpm für den Build (nur lokal).

Schritt für Schritt

Transkript: Jeder Schritt entspricht einem Untertitel im Video.

  1. Eigenes Kit für ein Projekt: kit:create kopiert das Start-Kit und benennt alles um.
  2. Die Ausgabe nennt die neuen Ordner und die nächsten Schritte: anpassen, bauen, testen, prüfen.
  3. Das Start-Kit ist das kleinste vollständige Kit: sechs Beispielblöcke, hell und dunkel, eine Akzentfarbe.
  4. Farben, Schrift und Navigation stellen Sie wie gewohnt unter Design ein – die Werte sind Design-Tokens des Kits.
  5. theme.php ist in Abschnitte § 1–11 gegliedert. Die Anleitung: Technische Dokumentation › Kits & Design.

Befehle & Konfiguration

php bin/console kit:create kanzlei                 # Kopie von themes/starter, Präfix starter_ → kanzlei_
cd tools && pnpm run build
php bin/console site:create kunde www.kunde.de kanzlei
php bin/console health --site=kunde
php themes/kanzlei/tools/contrast.php

Tipps & Stolperfallen

Tipp

kit:create name --from=basis nimmt ein anderes Kit als Vorlage.

Tipp

Budget der Startseite prüfen: CSS < 30 KB, JS < 8 KB (Start-Kit ≈ 15,7 KB / 0,4 KB).

Achtung

Nach Änderungen an assets/ neu bauen – public/themes/{name}/ enthält nur die gebauten Dateien.

Achtung

Das Start-Kit selbst nicht ändern – es ist die Vorlage für kit:create und wird mit Updates ersetzt.