ReadItLater Article

Template lookup order

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 a suffix (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 over index.amp.html, but index.amp.html will be chosen before index.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 and term types.

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:

layout: contact
title: Contact

layout = 'contact'
title = 'Contact'

{
   "layout": "contact",
   "title": "Contact"
}

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:

title: About
type: miscellaneous

title = 'About'
type = 'miscellaneous'

{
   "title": "About",
   "type": "miscellaneous"
}

layout: contact
title: Contact
type: miscellaneous

layout = 'contact'
title = 'Contact'
type = 'miscellaneous'

{
   "layout": "contact",
   "title": "Contact",
   "type": "miscellaneous"
}

Now place the layouts in the corresponding directory:

layouts/
└── miscellaneous/
    └── contact.html  <-- renders contact.md
    └── single.html   <-- renders about.md

Home templates

These template paths are sorted by specificity in descending order. The least specific path is at the bottom of each list.

Single templates

These template paths are sorted by specificity in descending order. The least specific path is at the bottom of each list.

Section templates

These template paths are sorted by specificity in descending order. The least specific path is at the bottom of each list.

Taxonomy templates

These template paths are sorted by specificity in descending order. The least specific path is at the bottom of each list.

The examples below assume the following site configuration:

taxonomies:
  category: categories

[taxonomies]
  category = 'categories'

{
   "taxonomies": {
      "category": "categories"
   }
}

Term templates

These template paths are sorted by specificity in descending order. The least specific path is at the bottom of each list.

The examples below assume the following site configuration:

taxonomies:
  category: categories

[taxonomies]
  category = 'categories'

{
   "taxonomies": {
      "category": "categories"
   }
}

These template paths are sorted by specificity in descending order. The least specific path is at the bottom of each list.

The examples below assume the following site configuration:

taxonomies:
  category: categories

[taxonomies]
  category = 'categories'

{
   "taxonomies": {
      "category": "categories"
   }
}