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.
-
10 SeitenLCP 1,6 sBFSG-Prüfung ohne Fehler
-
10 SeitenLCP 2,2 sBFSG-Prüfung ohne Fehler
-
10 SeitenLCP 2,0 sBFSG-Prüfung ohne Fehler
-
12 SeitenLCP 1,9 sBFSG-Prüfung ohne Fehler
-
10 SeitenLCP 1,9 sBFSG-Prüfung ohne Fehler
-
10 SeitenLCP 1,6 sBFSG-Prüfung ohne Fehler
-
10 SeitenLCP 2,0 sBFSG-Prüfung ohne Fehler
-
9 SeitenLCP 2,4 s
-
10 SeitenDeutschLCP 2,2 sBFSG-Prüfung ohne Fehler
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
- Design kaufen oder kostenloses Design laden, den Astro-Export entpacken.
- npm install, dann npm run dev und Inhalte in src/content anpassen.
- npm run build erzeugt den Ordner dist mit der fertigen Seite.
- 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
- HTMLJede Seite als HTML und CSS, Rechtsseiten-Gerüste, 404, Sitemap und Sicherheits-Header. Kein Build-Schritt.
- WordPresstheme.json v3, ein Pattern pro Abschnitt aus Core-Blöcken, Templates und Parts, als ZIP zum Hochladen.
- ReactTSX-Komponenten pro Abschnitt, Tailwind v4 @theme aus den Tokens, shadcn/ui-Variablen und eine Registry. Für Next.js oder Vite.
- ElementorHello-Elementor-Child-Theme mit selbst gehosteten Schriften und Tokens, ein Kit mit globalen Farben und Schriften. Nur die Design-Ebene.
Verwandt
- Astro: Handwerk & Mittelstand24
- Astro: Portfolios und Studios15
- Astro: IT & Software14
- Astro: Funnels & Landingpages13
- Astro: Onlineshops & E-Commerce12
- Astro: Beratung, Coaching & Kanzleien10
- Astro: Restaurants und Essen8
- Astro: Architektur und Interior7
- Astro: Fotografie7
- Astro: Vereine und Gemeinnütziges6
- Astro: Industrie und Energie6
- Astro: Conversion-Bausteine5
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.