Learning Hugo

By: Dave Walsh

         hugo · static content      hugo · getting started      hugo zero to hero

Estimated reading time: 2 minutes

A simple hugo site to capture how to learn HUGO.

The content for this home page comes from /content/_index.md the page itself has a layout in the layouts folder called index.html.

the index looks like:

{{ partial "homepage-header.html" . }}

{{ .Content }}
<p>The /layouts/index.html can also contain content in html format!</p>

{{ partial "footer.html" . }}

The index.html sets out the structure of the page:

  1. firstly it calls in the common header content which we create asa partial (/partial/homepage-header.html) so we can reuse the code.
  2. then it pulls in the content using {{ .Content }}, which calls the content form the “_index.md” file. Hugo automatically looks for a file called “_index.md” in the content root so we do not need to name the source of the content._index.md file
    • [NOTE] html an be added directly to the
  3. then we have our example of directly added content in html format, to show that we can provide content in other ways. we still need the _index.md file though for the front matter that provides the page title and other content, but I will explain this later on.
  4. finally we have out last command that calls in the footer. The footer was again seperated out into a partial so we can re-use the common code.

the html content inclusion can be seen below:

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

Installing Hugo