透過Hugo快速建置個人Blog

2018/03/18 posted in  Hugo comments

甚麼是Hugo?

Hugo是一款static site generator,讓你可以專注撰寫內容,然後自動compile成網站。

為甚麼不用google blogger, medium, wordpress, etc?

  • 可以寫Markdown,方便轉移content
  • 可以用別人的theme,同時又可以自己改HTML/CSS/JS

為甚麼不用Jekyll / Hexos?

  • 沒有Dependency(只需要Go)
  • Compile速度極快

快速建立網站

1. 安裝hugo:

brew install hugo

(macOS,其他系統可參考官網

2. 建立網站:

hugo new site quickstart # quickstart只是新folder的名稱

3. 加入主題:

cd quickstart
git init
git submodule add https://github.com/budparr/gohugo-theme-ananke.git themes/ananke
echo 'theme = "ananke"' >> config.toml # 在config中設定使用ananke
  • ananke是一個hugo的theme,官網還有很多theme可以選擇。
  • 官方建議用git submodule的方法來加入theme,但如果你需要改動它的話,可以選擇git clone,但一般改layout都不用直接改theme。
  • config.toml中的theme="xxx"代表你要使用themes/xxx

4. 新增內容:

hugo new posts/my-first-post.md
  • 這會新增一個markdown檔在content/posts/裡面。
  • 日後寫blog也是這樣新增,他會自動幫你填好日期時間之類的資料。

5. 開啟hugo server:

hugo server -D # `-D`代表包括所有draft=true的內容
# ...
# Web Server is available at http://localhost:1313/ (bind address 127.0.0.1)

之後看到提示可以到127.0.0.1:1313看看你的新網站了!

大概是這個樣子:

new_hugo

下次再寫更多關於theme、configuration和如何deploy到github吧!