npm
. Chris Macrae nous montre comment s’en servir pour créer votre premier site en moins de 30 minutes.hugo
. À l’intérieur se trouvent divers dossiers qui abritent le contenu de votre site, les gabarits de page et les fichiers CSS, JS, images, etc. L’arborescence de la structure de base ressemble à ceci — j’ai laissé quelques fichiers et dossiers de côté de façon à ce que ce soit plus clair :hugo-boilerplate
par défaut) :cd chemin/vers/hugo-boilerplate/
npm install
npm start
hugo/content
.hugo/content/posts/example.md
dans votre éditeur de texte. Il est composé d’un en-tête front matter avec un champ titre et d’un texte d’exemple au format markdown.date: "YYYY-MM-DDTHH:MM:SS-00:00"
YYYY-MM-DDTHH:MM:SS-00:00
avec une date valide, comme… 2018-01-01T12:42:00-00:00
. Si votre date se situe dans le futur, Hugo ne générera pas cet article en production.npm run hugo -- --
npm run hugo -- new posts/mon-premier-article.md
hugo/content/posts/mon-premier-article.md
. Ouvrez ce fichier dans votre éditeur de texte favori.hugo/config.toml
dans votre éditeur de texte favori et remplacer son contenu par celui-ci :hugo/config.toml
. Mettez à jour les valeurs suivantes comme bon vous semble :title = "Hugo Boilerplate"
description = "Bien démarrer avec Hugo
metadescription = "Utilisé dans la balise meta 'description' pour l’accueil et les pages d’index, faute de quoi c'est l’entrée 'description' du front matter de la page qui sera utilisé"
author = "VOTRE_NOM"
hugo/config.toml
, vous trouverez une section [params]
. Modifiez le paramètre cover
pour qu’il ait la valeur /img/darius-soodmand-116253.jpg
, sauvegardez vos changements.hugo/themes/hugo-theme-casper/layouts/
lors de la génération du site.hugo/layouts/
surchargeront n’importe quel gabarit du même nom présent dans le répertoire des gabarits du thème, nous permettant ainsi de personnaliser notre site sans toucher au thème d’origine.src/
seront traités automatiquement et déplacés dans le dossier hugo/static/
.hugo/layouts/partials/
:hugo/layouts/partials/header.html
dans votre éditeur de texte et repérez les lignes suivantes :footer.html
dans le dossier hugo/layouts/partials/
de manière à pouvoir ajouter notre fichier JS personnalisé :hugo/layouts/partials/footer.html
et repérez les lignes suivantes :src/css/styles.css
et ajoutez le code suivant à la fin du fichier :hugo/layouts/
.