TEMPLATES FUNDAMENTALS MODÈLES FONDAMENTAUX

Ordre de Recherche Hugo

Avant de créer vos modèles, il est important de savoir comment Hugo recherche des fichiers dans la structure de répertoire de votre projet.

Hugo utilise une liste prioritaire appelée ordre de recherche car elle traverse votre dossier layouts dans votre projet Hugo en cherchant le modèle approprié pour rendre votre contenu.

L’ordre de recherche de modèle est une cascade inversée : si le modèle A n’est pas présent ou spécifié, Hugo se tournera vers le modèle B. Si le modèle B n’est pas présent ou spécifié, Hugo recherchera le modèle C … et ainsi de suite jusqu’à ce qu’il atteigne le dossier _default/ pour votre projet ou votre thème. À bien des égards, l’ordre de recherche est similaire au concept de programmation d’une instruction de commutation sans décalage.

La puissance de l’ordre de recherche est qu’elle vous permet d’élaborer des mises en page spécifiques et de garder votre modélisation DRY.

{{% note %}} La plupart des sites web Hugo n’auront besoin que des fichiers de modèles par défaut à la fin de l’ordre de recherche (à savoir _default/*.html). {{% /note %}}

Ordres de Recherche

L’odre de recherche respectif pour chacun des modèles de Hugo a été défini dans la documentation d’Hugo :

Exemples de Recherche de Modèle

L’ordre de recherche est mieux illustré par des exemples. Ce qui suit vous montre le processus utilisé par Hugo pour trouver le modèle approprié pour rendre vos modèles de page unique, mais le concept est vrai pour tous les modèles de Hugo.

  1. Le projet utilise la thèse mytheme (spécifié dans la configuration du projet).
  2. Les layouts et les dossiers de contenu du projet sont les suivants :
.
├── content
│   ├── events
│   │   ├── _index.md
│   │   └── my-first-event.md
│   └── posts
│       ├── my-first-post.md
│       └── my-second-post.md
├── layouts
│   ├── _default
│   │   └── single.html
│   ├── posts
│   │   └── single.html
│   └── reviews
│       └── reviewarticle.html
└── themes
    └── mytheme
        └── layouts
            ├── _default
            │   ├── list.html
            │   └── single.html
            └── posts
                ├── list.html
                └── single.html

Maintenant nous pouvons regarder le front matter pour les trois fichiers de contenu (à savoir .md).

{{% notice note %}} Seuls trois des quatre fichiers markdown dans le projet ci-dessus sont soumis à l’ordre de recherche de page unique. _index.md est un type kind spécifique à Hugo. Alors que my-first-post.md, my-second-post.md et my-first-event.md sont tous les trois de type page, tous les fichiers _index.md dans un projet Hugo sont utilisés pour ajouter du contenu et un front matter pour des listes de pages. Dans cet exemple, events/_index.md produira en fonction de son modèle de section et de l’ordre de recherche respectif. {{% /notice %}}

Exemple : mon-premier-post.md

{{% code file=“content/posts/mon-premier-post.md” copy=“false” %}}

---
title: Mon Premier Post
date: 2017-02-19
description: Ceci est mon premier post.
---

{{% /code %}}

Au moment de construire votre site, Hugo passera l’ordre de recherche jusqu’à ce qu’il trouve ce dont il a besoin pour my-first-post.md :

  1. /layouts/UNSPECIFIED/UNSPECIFIED.html
  2. /layouts/posts/UNSPECIFIED.html
  3. /layouts/UNSPECIFIED/single.html
  4. /layouts/posts/single.html
    BREAK
  5. /layouts/_default/single.html
  6. /themes/<THEME>/layouts/UNSPECIFIED/UNSPECIFIED.html
  7. /themes/<THEME>/layouts/posts/UNSPECIFIED.html
  8. /themes/<THEME>/layouts/UNSPECIFIED/single.html
  9. /themes/<THEME>/layouts/posts/single.html
  10. /themes/<THEME>/layouts/_default/single.html

Notez le terme UNSPECIFIED plutôt que UNDEFINED. Si vous n’indiquez pas à Hugo le type et le layout spécifiques, il fera des hypothèses basées sur des valeurs par défaut saines. Mon-premier-post.md ne spécifie pas un type de contenu dans son front matter. Par conséquent, Hugo suppose que le contenu type et section (c’est-à-dire posts, qui est défini par l’emplacement du fichier) sont un dans le même. (Plus d’infos ici sur les sections.)

Mon-premier-post.md ne spécifie pas non plus un layout dans son front matter. Par conséquent, Hugo suppose que mon-premier-post.md, qui est de type page et un unique élément de contenu, devrait par défaut être la prochaine occurrence d’un modèle single.html dans la recherche (#4).

Exemple : mon-second-post.md

{{% code file=“content/posts/mon-second-post.md” copy=“false” %}}

---
title: Mon Second Post
date: 2017-02-21
description: Ceci est mon second post.
type: review
layout: reviewarticle
---

{{% /code %}}

Voici le moyen avec lequel Hugo traverse l’odre de recherche de page-unique pour my-second-post.md:

  1. /layouts/review/reviewarticle.html
    BREAK
  2. /layouts/posts/reviewarticle.html
  3. /layouts/review/single.html
  4. /layouts/posts/single.html
  5. /layouts/_default/single.html
  6. /themes/<THEME>/layouts/review/reviewarticle.html
  7. /themes/<THEME>/layouts/posts/reviewarticle.html
  8. /themes/<THEME>/layouts/review/single.html
  9. /themes/<THEME>/layouts/posts/single.html
  10. /themes/<THEME>/layouts/_default/single.html

Le front matter dans mon-second-post.md spécifie le contenu type (c’est-à-dire review) ainsi que le layout (c’est-à-dire reviewarticle). Hugo trouve la mise en page dont il a besoin au niveau supérieur de la recherche (#1) et ne continue pas à rechercher dans les autres modèles.

{{% notice note “Type et pas de Types”%}} Notez que le répertoire du modèle pour mon-second-post.md est review et non reviews. Ceci parce que type est toujours singulier lorsqu’il est défini dans le front matter. {{% /notice %}}

Exemple : my-first-event.md

{{% code file=“content/events/my-first-event.md” copy=“false” %}}

---
title: My First Event
date: 2018-07-06
description: Ceci est un évenement à venir..
---

{{% /code %}}

Voici la façon avec laquelle Hugo traverse l’ordre de recherche de page-unique pour my-first-event.md:

  1. /layouts/UNSPECIFIED/UNSPECIFIED.html
  2. /layouts/events/UNSPECIFIED.html
  3. /layouts/UNSPECIFIED/single.html
  4. /layouts/events/single.html
  5. /layouts/_default/single.html
    BREAK
  6. /themes/<THEME>/layouts/UNSPECIFIED/UNSPECIFIED.html
  7. /themes/<THEME>/layouts/events/UNSPECIFIED.html
  8. /themes/<THEME>/layouts/UNSPECIFIED/single.html
  9. /themes/<THEME>/layouts/events/single.html
  10. /themes/<THEME>/layouts/_default/single.html

{{% note %}} my-first-event.md est important car il démontre le rôle de l’ordre de recherche dans les thèmes de Hugo. Le répertoire de projet racine et le répertoire thèmes mytheme ont un fichier sur _default/single.html. La compréhension de cet ordre vous permet de personnaliser les thèmes Hugo en créant des fichiers de modèles avec des noms identiques dans votre répertoire de projet qui se positionnent devant les fichiers de modèle de thème dans la recherche. Cela vous permet de personnaliser l’apparence de votre site Web tout en maintenant la compatibilité avec le thème en amont. {{% /note %}}

“Ordre de Recherche Hugo” a été mise à jour le : July 19, 2017
Améliorez cette page