Using Partials

By: Dave Walsh

         hugo · partials · theme      hugo · partials · sections      hugo zero to hero

Estimated reading time: 1 minute

What are partials?

Partials are chunks of code that you will use multiple times throughout your site. The header or nav or even footer are the most common ones.

Rather than having to code these in every page you simply code them once. This also helps a lot if you need to change them after you have them in many pages.

How and when to use them.

It makes sense to create a partial every time you think you may need to use this code in more than one place. You can also create a partial if you want to isolate out a function or chunk of code that you may only use in one page. Seperation of code (some what like object orientation) can make it easier to identify code at a later date.

Creating partials and using them.

To create a partial:

  1. Create a new directory in the layouts folder called partials
  2. Create a new markdown page in the partials folder with a meaningful name. e.g. header.md
  3. Add in your chunk of code.
  4. A a link in the template to the partial. e.g. {{ partial "header.html" . }}

Part 5 of 15 in the hugo zero to hero series.

Series Start | Creating Static Pages | Hugo Markdown