Un thème de blog minimaliste construit avec Astro. Une version de démarrage rapide et facile pour tous ceux qui souhaitent créer leur propre blog.
Voir la démo · Signaler un bug · Demander une fonctionnalité
Motivation
Principales fonctionnalités
Démo
Démarrage rapide
Commandes
Configuration de votre site Web
Configuration du site, liens vers les réseaux sociaux et liens de la barre de navigation
Ajout de publications et de projets
Prise en charge multilingue
Déployer
Fonctionnalité supplémentaire
Crédit
Bien qu'il existe déjà de nombreux thèmes de blog, j'en voulais un qui dégagerait cette ambiance de terminal/dev et quelques fonctionnalités que d'autres thèmes n'avaient pas.
Astro v4 Rapide
Classes d'utilitaires TailwindCSS
Balisage HTML sémantique et accessible
Adaptatif et optimisé pour le référencement
Prise en charge multilingue
Mode sombre/clair, utilisant les variables Tailwind et CSS
Articles et projets épinglés
Intégration d'Astro Assets pour des images optimisées
Messages MD et MDX
Pagination
Flux RSS automatique
Plan du site généré automatiquement
Composant d'icône Astro Icon svg
Bouton Retour en haut
Découvrez la démo ici.
Créez un nouveau dépôt à partir de ce modèle.
# npm 7+ npm create astro@latest -- --template kirontoo/astro-theme-cody # pnpm pnpm dlx create-astro --template kirontoo/astro-theme-cody
(retour en haut)
Toutes les commandes sont exécutées depuis la racine du projet, depuis un terminal :
Commande | Action |
---|---|
pnpm install | Installe les dépendances |
pnpm run dev | Démarre le serveur de développement local sur localhost:4321 |
pnpm run build | Construisez votre site de production sur ./dist/ |
pnpm run preview | Prévisualisez votre build localement, avant de le déployer |
pnpm run astro ... | Exécutez des commandes CLI comme astro add , astro check |
pnpm run astro -- --help | Obtenez de l'aide pour utiliser l'Astro CLI |
(retour en haut)
La configuration de votre site, les liens vers les réseaux sociaux et les liens de la barre de navigation sont tous placés dans src/consts.ts
. Là, vous pouvez configurer le titre par défaut de votre site, la description, la langue, le profil, les liens vers les réseaux sociaux et les liens visibles dans la barre de navigation.
Ce thème utilise des collections de contenu pour organiser les fichiers Markdown et/ou MDX, ainsi que des éléments de vérification de type avec un schéma -> src/content/config.ts
.
Vous pouvez trouver des exemples d'articles de blog dans src/content/blog
et des exemples de projets dans src/content/project
.
Propriété (* = obligatoire) | Description |
---|---|
titre * | Titre de votre message. Limité à un maximum de 150 caractères |
description * | Brève description de votre message, qui sera également utilisée pour le référencement. A une longueur maximale de 250 caractères. |
Date de publication * | Date de publication |
Date de mise à jour | Date facultative représentant la date à laquelle la publication a été mise à jour. Notez que cette date sera utilisée à la place de la date de publication pour commander les publications lorsqu'elles seront disponibles. |
hérosImage | Image de couverture facultative pour votre publication. Incluez à la fois une src et une propriété alt . Vérifiez src/content/blog/first-post.md pour un exemple. |
ogImage | Image facultative utilisée pour le référencement. |
balises | Utilisez des balises facultatives pour organiser vos publications en catégories ou sujets. Toutes les balises seront affichées dans yourdomain.com/tags . |
série | Utilisez des séries facultatives pour organiser vos publications en une série de publications. Toutes les séries seront affichées sur yourdomain.com/series . |
brouillon | Booléen facultatif. Supprime les articles de la publication. |
commande | Valeur numérique facultative comprise entre 1 et 5 pour épingler certains messages en haut. Limité à seulement 5 messages épinglés |
cacher | Booléen facultatif. Masquer un article sur la page /blog . Apparaîtra toujours dans /archive |
Propriété (* = obligatoire) | Description |
---|---|
titre * | Titre de votre projet. Limité à un maximum de 150 caractères |
description * | Brève description de votre projet, qui servira également pour le référencement. |
Date de publication * | Date de publication |
hérosImage | Image de couverture facultative pour votre projet. Incluez à la fois une src et une propriété alt . Vérifiez src/pages/projects/project-1.md pour un exemple. |
ogImage | Image facultative utilisée pour le référencement. |
empiler * | Une liste des technologies utilisées par votre projet qui seront affichées sous forme d'icônes. Ce thème utilise la bibliothèque SVG Logos, vous pouvez utiliser icones.js.org pour trouver les icônes dont vous avez besoin. |
plate-forme | Lien vers le site Web ou la démo |
site web | Lien vers le site Web ou la démo |
github | Votre lien de dépôt github |
brouillon | Booléen facultatif. Supprime les projets de la publication. |
commande | Valeur numérique facultative comprise entre 1 et 5 pour épingler certains projets en haut. Limité à seulement 5 messages épinglés |
(retour en haut)
Consultez le wiki pour configurer la prise en charge multilingue de votre blog.
Astro fournit une excellente documentation pour déployer vos sites Web Astro sur diverses plateformes. Vous pouvez le trouver ici.
Consultez Astro Recipes pour ajouter d’autres fonctionnalités comme un flux RSS.
Ce thème est basé sur le thème Astro Cactus et Hugo Risotto.
(retour en haut)