cb18a5183 Fix broken link 07a0198bf Config: Place Google Analytics tag ID under the services key 4bf0c719f Fix typo 50d8ad1af Fix muiltilingual menu definition instructions 1a32519a9 Fix typos 6f34ca8e0 Explain usage of front matter to target a template 5bd977257 Improve goldmark config docs 447632938 Remove Docker notes from installation instructions 84741d173 Update reference to hugo.work 0338d7c71 Fix menu template f5d2f5ed4 Fix typos in content/en/functions/fmt a3a40ff99 Add return type to functions 85ac3e779 Remove outdated feature image d47d889e4 Fix signatures 7551ba28f Document safe.JSStr function e77993be0 Document keyVals function 4dba20db3 Update theme babf91544 Update echoparam 8c8203efa Adjust related functions 4cb1b30fc Fix example ba95eca64 Improve showcase prose 5d3dcf366 Add Overmind Studios showcase 8d634ac70 Change code blocks from indented to fenced cfab978e6 Add missing code fences 407dd5c47 Limit related pages for functions to other functions 9fa67d981 Fix .Site.LastChange doc 393aa16d0 netlify: Hugo 0.119.0 f864af97a docs: Even more about images.Process 9d772d5f0 docs: More about images.Process bc655f869 docs: Regen docshelper 41c3536d1 Merge commit '9aec42c5452b3eb224888c50ba1c3f3b68a447e9' 918ed53f4 Add images.Process filter 573645883 Add $image.Process a1151b0fd Add images.Opacity filter git-subtree-dir: docs git-subtree-split: cb18a5183fc62f301ffde50b8c39f03e4b897aec
4.7 KiB
title | description | categories | keywords | menu | weight | toc | |||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
Template lookup order | Hugo uses the rules below to select a template for a given page, starting from the most specific. |
|
|
|
30 | true |
Lookup rules
Hugo takes the parameters listed below into consideration when choosing a template for a given page. The templates are ordered by specificity. This should feel natural, but look at the table below for concrete examples of the different parameter variations.
- Kind
- The page
Kind
(the home page is one). See the example tables below per kind. This also determines if it is a single page (i.e. a regular content page. We then look for a template in_default/single.html
for HTML) or a list page (section listings, home page, taxonomy lists, taxonomy terms. We then look for a template in_default/list.html
for HTML). - Layout
- Can be set in front matter.
- Output Format
- See Custom Output Formats. An output format has both a
name
(e.g.rss
,amp
,html
) and asuffix
(e.g.xml
,html
). We prefer matches with both (e.g.index.amp.html
, but look for less specific templates.
Note that if the output format's Media Type has more than one suffix defined, only the first is considered.
- Language
- We will consider a language tag in the template name. If the site language is
fr
,index.fr.amp.html
will win overindex.amp.html
, butindex.amp.html
will be chosen beforeindex.fr.html
. - Type
- Is value of
type
if set in front matter, else it is the name of the root section (e.g. "blog"). It will always have a value, so if not set, the value is "page". - Section
- Is relevant for
section
,taxonomy
andterm
types.
{{% note %}} Templates can live in either the project's or the themes' layout folders, and the most specific templates will be chosen. Hugo will interleave the lookups listed below, finding the most specific one either in the project or themes. {{% /note %}}
Target a template
You cannot change the lookup order to target a content page, but you can change a content page to target a template. Specify type
, layout
, or both in front matter.
Consider this content structure:
content/
├── about.md
└── contact.md
Files in the root of the content directory have a content type of page
. To render these pages with a unique template, create a matching subdirectory:
layouts/
└── page/
└── single.html
But the contact page probably has a form and requires a different template. In the front matter specify layout
:
{{< code-toggle file=content/contact.md copy=false >}} title = 'Contact' layout = 'contact' {{< /code-toggle >}}
Then create the template for the contact page:
layouts/
└── page/
└── contact.html <-- renders contact.md
└── single.html <-- renders about.md
As a content type, the word page
is vague. Perhaps miscellaneous
would be better. Add type
to the front matter of each page:
{{< code-toggle file=content/about.md copy=false >}} title = 'About' type = 'miscellaneous' {{< /code-toggle >}}
{{< code-toggle file=content/contact.md copy=false >}} title = 'Contact' type = 'miscellaneous' layout = 'contact' {{< /code-toggle >}}
Now place the layouts in the corresponding directory:
layouts/
└── miscellaneous/
└── contact.html <-- renders contact.md
└── single.html <-- renders about.md
Home page
{{< datatable-filtered "output" "layouts" "Kind == home" "Example" "OutputFormat" "Suffix" "Template Lookup Order" >}}
Single pages
{{< datatable-filtered "output" "layouts" "Kind == page" "Example" "OutputFormat" "Suffix" "Template Lookup Order" >}}
Section pages
A section page is a list of pages within a given section.
{{< datatable-filtered "output" "layouts" "Kind == section" "Example" "OutputFormat" "Suffix" "Template Lookup Order" >}}
Taxonomy pages
A taxonomy page is a list of terms within a given taxonomy. The examples below assume the following site configuration:
{{< code-toggle file=hugo copy=false >}} [taxonomies] category = 'categories' {{< /code-toggle >}}
{{< datatable-filtered "output" "layouts" "Kind == taxonomy" "Example" "OutputFormat" "Suffix" "Template Lookup Order" >}}
Term pages
A term page is a list of pages associated with a given term. The examples below assume the following site configuration:
{{< code-toggle file=hugo copy=false >}} [taxonomies] category = 'categories' {{< /code-toggle >}}
{{< datatable-filtered "output" "layouts" "Kind == term" "Example" "OutputFormat" "Suffix" "Template Lookup Order" >}}