Personnalisation
Personnalisez le thème Jekyll Zer0-Mistakes — mises en page, styles, navigation et plus encore.
Personnalisation
Personnalisez le thème Zer0-Mistakes pour l’adapter à votre marque et à vos besoins.
Domaines de personnalisation
| Domaine | Emplacement | Description |
|---|---|---|
| Mises en page | _layouts/ |
Modèles et structure des pages |
| Styles | _sass/ |
Personnalisation CSS/SCSS |
| Navigation | _data/navigation/ |
Configuration du menu et de la barre latérale |
| Composants | _includes/ |
Composants HTML réutilisables |
Personnalisations rapides
Identité du site
Mettez à jour _config.yml :
title: "Your Site Title"
subtitle: "Your tagline"
description: "Site description for SEO"
preview: /images/previews/customization.png
author:
name: "Your Name"
email: "you@example.com"
bio: "About the author"
logo: /assets/images/logo.png
Couleurs et image de marque
Créez ou modifiez _sass/custom.scss :
// Override Bootstrap variables
$primary: #your-color;
$secondary: #your-color;
// Custom styles
body {
font-family: 'Your Font', sans-serif;
}
Navigation
Modifiez les fichiers dans _data/navigation/ :
# _data/navigation/main.yml
- title: "Home"
url: /
- title: "Blog"
url: /blog/
- title: "Docs"
url: /docs/
Guides de cette section
- Mises en page — Créer et personnaliser les modèles de pages
- Styles — Personnalisation CSS et thématisation
- Navigation — Configurer les menus et les barres latérales
Hiérarchie des mises en page
root.html ← Base HTML structure
└── default.html ← Main wrapper with navigation
├── home.html ← Homepage layout
├── journals.html ← Blog posts
├── collection.html ← Collection pages
└── landing.html ← Full-width landing pages
Remplacer les fichiers du thème
Pour remplacer n’importe quel fichier du thème :
- Créez le même chemin de fichier dans votre site
- Jekyll utilise votre version au lieu de celle du thème
Exemple : remplacez le pied de page en créant _includes/core/footer.html.
Étapes suivantes
- Guide des mises en page — Modèles de pages
- Guide des styles — Personnalisation CSS
- Guide de navigation — Configuration du menu
Référence technique
Pour les détails destinés aux contributeurs (architecture SCSS, catalogue des jetons de design, modèles d’extension compatibles avec les forks) :
Voir aussi
- [[Bootstrap Integration]]
- [[Features]]
- [[Liquid]]
- [[Jekyll]]