Articles et pages individuelles
Cette section concerne les content collections blog
et pages
.
Sidenotes
Pour activer les sidenotes, ajouter l’objet sidenote
dans le frontmatter en précisant tout ou partie de ses options, les valeurs par défaut étant surlignées :
label
:number
: numérotation à la manière des notes de bas de page classiques.symbol
: astérisque.none
: permet de produire une note de marge (margin note).
toggle
: sur mobile, l’apparence du label change et est cliquable pour changer la valeur devisible
.visible
: visibilité de la sidenote sur mobile par défaut.removeFootnotes
: masquer la section « Notes » en bas de page après avoir généré les sidenotes.layoutOnly
: ne pas générer les sidenotes à partir des footnotes (ignorant les options précédentes) mais tout de même activer la disposition de page adaptée aux sidenotes, en vue d’une utilisation des composants.
Ces options affectent les footnotes écrites avec la syntaxe Markdown, qui sont transformées en sidenotes en JavaScript côté client.
Pour appliquer d’autres options à une sidenote précise, il est possible d’utiliser le composant <Sidenote> et de lui passer les options souhaitées. Si aucune option n’est passée, les options par défaut de <Sidenote>
sont label: symbol
, toggle: true
et visible: false
. Il existe également <MarginNote> qui est un raccourci pour label: none
, toggle: false
et visible: true
.
<Sidenote>
et <MarginNote>
, il n’est pas possible d’utiliser des éléments de type bloc comme les paragraphes (<p>
). Pour cela, il faut obligatoirement utiliser la syntaxe Markdown. Voir <Sidenote>.
/kitchen
Nommage des fichiers
Les ingrédients et les recettes partagent l’URL /kitchen/{slug}
. Attention aux conflits.
Conventions typographiques
On sépare la partie décimale des nombres avec une virgule.
Une bouteille de 1,5 litre.
Le symbole d’unité est séparé par une espace insécable.
12,5 km, 12,50 €, 12,5 °C, 120 g.
Syntaxe
Dans une recette, les ingrédients doivent être un slug existant. La quantité, optionnelle, doit être une string si elle est précisée.
Un élément gras en début de liste est considéré comme un sous-titre et transformé en petites capitales. Si la liste n’est pas numérotée, la puce est retirée et le titre est indenté en arrière.
Le composant <Ing>
affiche une pop-up contenant les infos de l’ingrédient. La syntaxe est un raccourci de <Ingredient> et <IngredientInPopup>.
/gear
Nommage des fichiers
Le premier dossier représente la catégorie mais ne fait pas partie du slug :
Par exemple, le fichier gear/phones/iphone-11.mdx
peut être lu à l’adresse /gear/iphone-11
.
/diary
Nommage des fichiers
Le chemin des fichiers est :
Il est nécessaire de spécifier un slug dans le frontmatter pour que ce chemin n’apparaisse pas dans l’URL.
Date
Dans le frontmatter, la date est optionnelle. Si elle est absente, l’année donnée dans le chemin fait office de date approximative.
Listes de lieux
Par défaut, les lieux indiqués dans le frontmatter sont affichés dans une liste au début de la page et sont reliés à l’entrée, ce qui est utilisé à d’autres endroits du site.
Le composant <PlacesList> permet d’afficher une liste similaire à un endroit choisi du document. Cependant, les lieux ne seront pas reliés à l’entrée comme s’ils étaient présents dans le frontmatter. Pour régler ce problème, les entrées utilisant <PlacesList>
peuvent masquer la liste par défaut et y ajouter tous les lieux mentionnés.
Ressources
Paramètres de frontmatter
Le fichier src/content/config.ts
(inaccessible car situé dans le submodule privé) contient la liste des content collections existantes et leur schéma. Voici son contenu :