This tutorial will show you how to create a simple theme in Hugo. I assume that you are familiar with HTML, the bash command line, and that you are comfortable using Markdown to format content. I’ll explain how Hugo uses templates and how you can organize your templates to create a theme. I won’t cover using CSS to style your theme.
We’ll start with creating a new site with a very basic template. Then we’ll add in a few pages and posts. With small variations on that, you will be able to create many different types of web sites.
Jekyll has a rule that any directory not starting with _ will be copied as-is to the _site output. Hugo keeps all static content under static. You should therefore move it all there.
With Jekyll, something that looked like
â–¾ <root>/
â–¾ images/
logo.png
should become
â–¾ <root>/
â–¾ static/
â–¾ images/
logo.png
Additionally, you’ll want any files that should reside at the root (such as CNAME) to be moved to static.
Hugo uses the excellent Gohtml/template library for
its template engine. It is an extremely lightweight engine that provides a very
small amount of logic. In our experience that it is just the right amount of
logic to be able to create a good static website. If you have used other
template systems from different languages or frameworks you will find a lot of
similarities in Go templates.
This document is a brief primer on using Go templates. The Go docs
provide more details.