Introduction #

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.

Move static content to static #

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 Go html/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.

Step 1. Install Hugo #

Go to Hugo releases and download the appropriate version for your OS and architecture.

Save it somewhere specific as we will be using it in the next step.

More complete instructions are available at Install Hugo

Step 2. Build the Docs #

Hugo has its own example site which happens to also be the documentation site you are reading right now.

Follow the following steps:

awk #

awk是处理文本文件的一个应用程序，几乎所有 Linux 系统都自带这个程序。

它依次处理文件的每一行，并读取里面的每一个字段。对于日志、CSV 那样的每行格式相同的文本文件，awk可能是最方便的工具。

awk其实不仅仅是工具软件，还是一种编程语言。不过，这里只介绍它的命令行用法，对于大多数场合，应该足够用了。

基本用法 #

awk的基本用法就是下面的形式。

# 格式
$ awk 动作 文件名

# 示例
$ awk '{print $0}' demo.txt

上面示例中，demo.txt是awk所要处理的文本文件。前面单引号内部有一个大括号，里面就是每一行的处理动作print $0。其中，print是打印命令，$0代表当前行，因此上面命令的执行结果，就是把每一行原样打印出来。

下面，我们先用标准输入（stdin）演示上面这个例子。

$ echo 'this is a test' | awk '{print $0}'
this is a test

上面代码中，print $0就是把标准输入this is a test，重新打印了一遍。

awk会根据空格和制表符，将每一行分成若干字段，依次用$1、$2、$3代表第一个字段、第二个字段、第三个字段等等。

$ echo 'this is a test' | awk '{print $3}'
a

上面代码中，$3代表this is a test的第三个字段a。

下面，为了便于举例，我们把/etc/passwd文件保存成demo.txt。

root:x:0:0:root:/root:/usr/bin/zsh
daemon:x:1:1:daemon:/usr/sbin:/usr/sbin/nologin
bin:x:2:2:bin:/bin:/usr/sbin/nologin
sys:x:3:3:sys:/dev:/usr/sbin/nologin
sync:x:4:65534:sync:/bin:/bin/sync

这个文件的字段分隔符是冒号（:），所以要用-F参数指定分隔符为冒号。然后，才能提取到它的第一个字段。

$ awk -F ':' '{ print $1 }' demo.txt
root
daemon
bin
sys
sync

变量 #

除了$ + 数字表示某个字段，awk还提供其他一些变量。