Export · Astro

Astro-Themes, die als ganze Website ankommen

Der Astro-Export macht aus einem Kiekkist-Design ein Astro-Projekt, das du mit npm run build zu einer statischen Website baust. Jeder Abschnitt der Vorlage wird eine eigene Komponente, Texte und Listen liegen als Content Collections daneben. Du änderst Inhalte in Dateien statt in Templates.

Das passt, wenn du schnelle Seiten ohne Server-Pflege willst: Die fertige Seite ist HTML, CSS und etwas JavaScript, die auf jedem Webspace laufen. Wer später ein Headless-CMS anschließen will, findet die Konfiguration dafür im Projekt.

Designs ansehenEin Design 59 € einmalig, alle Exporte inklusive.

Designs mit diesem Export

94 Designs wurden mit dem Astro-Export gebaut, bevor sie in die Galerie kamen. Die Lizenz gilt für alle Exporte desselben Designs.

Alle 94 ansehen

Was du bekommst

Komponenten
Ein Astro-Component pro Abschnitt, Props mit Typen, die Originaltexte als Startwerte.
Inhalte
content.config.ts mit einer Collection pro Liste: Leistungen, Projekte, Team, FAQ.
Layout und Sicherheit
Base-Layout mit Meta-Daten, Content-Security-Policy an, Schriften selbst gehostet.
Design-Tokens
Farben, Schriften und Abstände als CSS-Variablen, beschrieben in der DESIGN.md.

So kommt es auf die Seite

  1. Design kaufen oder kostenloses Design laden, den Astro-Export entpacken.
  2. npm install, dann npm run dev und Inhalte in src/content anpassen.
  3. npm run build erzeugt den Ordner dist mit der fertigen Seite.
  4. dist auf deinen Webspace laden oder über Git deployen, zum Beispiel mit Coolify oder einem EU-Hoster.

Was nicht dabei ist

Ein Redaktionssystem ist nicht eingebaut. Wenn Kunden selbst Texte ändern sollen, brauchst du ein Headless-CMS oder den WordPress-Export.

Ein Design, dein Stack

Verwandt

Fragen

Welche Astro-Version?

Der Export ist für Astro 7 geschrieben und wird für jedes Design einmal gebaut, bevor es in die Galerie kommt.

Brauche ich Tailwind?

Nein. Das Design bringt eigenes CSS mit Tokens mit. Wer Tailwind will, nimmt den React-Export oder ergänzt es selbst.