Creating a New Theme

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.

Migrating from Jekyll

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.

Markup Image Demo

Markup and images Example of displaying image with MARKUP only ![Alternate text that get displayed if image cannot be found](/images/notebook.jpg "Title for image") Example of scaling image with combination of CSS and MARKUP With Markup there is no option to further style the image.

Publishing date article

. Define when article get published With Hugo it is easy to define when article get displayed. Every article can have area with some FRONTMATTER setting. One possible entry is pubdate. Hugo has to run on this date to create static files.

GIT - Save credentials

Git - Save credentials for longer time On every action against external GIT you get asked for credentials. If you use HTTPS for connection to external GIT, this hint could be helpfull to prevent from need of repeating enter your credentials. Setting that credentials get stored git config credential.