Hugo介紹
Hugo是由Go語言實現(xiàn)的靜態(tài)網(wǎng)站生成器。簡單、易用、高效、易擴(kuò)展、快速部署。
安裝Hugo
# Mac安裝
$ brew install hugo
# 查看版本
$ hugo version
幫助文檔：
# 查看幫助文檔
$ hugo help
命令格式:
hugo
hugo [flags]
hugo [command]
hugo [command] [flags]
常用command:
new #為你的站點創(chuàng)建新的內(nèi)容
server #一個高性能的web服務(wù)器
常用flags:
-D, --buildDrafts #包括被標(biāo)記為draft的文章
-E, --buildExpired #包括已過期的文章
-F, --buildFuture #包括將在未來發(fā)布的文章
命令示例:
hugo -D #生成靜態(tài)文件并包括draft為true的文章
hugo new post/new-content.md #新建一篇文章
hugo new site mysite #新建一個稱為mysite的站點
hugo server --buildExpired #啟動服務(wù)器并包括已過期的文章
創(chuàng)建站點
# 創(chuàng)建一個博客站點
$ hugo new site ~/hugo/shongsheng
# 站點目錄結(jié)構(gòu)
$ tree ~/hugo/shongsheng
/Users/sybs/hugo/shongsheng
├── archetypes
│ └── default.md
├── config.toml
├── content
├── data
├── layouts
├── static
└── themes
目錄說明：
-
archetypes: 儲存
.md的模板文件，類似于hexo的scaffolds，該文件夾的優(yōu)先級高于主題下的/archetypes文件夾 - config.toml: 配置文件
-
content: 儲存網(wǎng)站的所有內(nèi)容，類似于
hexo的source -
data: 儲存數(shù)據(jù)文件供模板調(diào)用，類似于
hexo的source/_data -
layouts: 儲存
.html模板，該文件夾的優(yōu)先級高于主題下的/layouts文件夾 -
static: 儲存圖片,css,js等靜態(tài)文件，該目錄下的文件會直接拷貝到
/public，該文件夾的優(yōu)先級高于主題下的/static文件夾 - themes: 儲存主題
-
public: 執(zhí)行
hugo命令后，儲存生成的靜態(tài)文件
創(chuàng)建主題
$ cd ~/hugo/shongsheng
$ git clone https://github.com/spf13/hyde.git ./themes/hyde
git clone git@github.com:olOwOlo/hugo-theme-even.git themes/even
git submodule add https://github.com/budparr/gohugo-theme-ananke.git themes/ananke
https://themes.gohugo.io/hugo-theme-easybook/
創(chuàng)建文章
$ cd ~/hugo/shongsheng
# 創(chuàng)建名為first的文章
$ hugo new post/first.md
$ vim ./content/post/first.md
---
title: "First"
date: 2020-03-13T13:57:40+08:00
draft: true
---
- hello
啟動站點
# 啟動站點
$ hugo server --theme=hyde --buildDrafts
# 瀏覽器打開
$ open http://localhost:1313
配置Hugo
編輯config.toml站點配置你文件。完整的配置文件可以參考官方文檔。
# 主機(jī)名 例如: http://spf13.com/
baseURL = "blog.mafool.com"
# 語言編碼(中文: zh-CN)
languageCode = "zh-CN"
# 默認(rèn)的內(nèi)容語言
defaultContentLanguage = ""
# 自動檢測是否包含中文/日文/韓文，該參數(shù)會影響摘要和字?jǐn)?shù)統(tǒng)計功能，建議設(shè)置為true
hasCJKLanguage = false
# 若為 false，`Getting Started` 這樣的英文標(biāo)簽將會被轉(zhuǎn)換為 `getting-started`
preserveTaxonomyNames = true
# 設(shè)置使用的主題名稱 (默認(rèn)儲存在 /themes/THEMENAME/)
theme = "ananke"
# 分頁
paginate = 10
paginatePath = "page"
# 啟用 Emoji; see emoji-cheat-sheet.com
enableEmoji = false
# 創(chuàng)建robots.txt，建議設(shè)置為true
enableRobotsTXT = false
# 定義文章訪問路徑，詳細(xì)見下文"URL管理" See "content-management/urls/"
permalinks = "/blogs"
URL管理
正如前文所言，hugo會將content/目錄下的結(jié)構(gòu)反映到生成的靜態(tài)網(wǎng)站中，但config.toml中的permalinks參數(shù)允許你自由更改內(nèi)容的URL。例如：你想從hexo遷移到hugo，你可以將permalinks定義為下面這種形式以適應(yīng)之前的URL。
[permalinks]
post = "/:year/:month/:title/"
上面的配置將改變content/post/文件夾下所有文章的URL。
舉個栗子，content/post/sample-entry.md的URL將從默認(rèn)的https://example.com/post/sample-entry/改變?yōu)?code>https://example.com/2013/11/sample-entry/。
所有可用的屬性如下：
/:monthname/:day/:weekday/:weekdayname/:yearday/:section/:title/:slug/:filename/
內(nèi)容摘要
Hugo會自動提取文章的前70個字符作為摘要。（注意：該功能在中文環(huán)境下需要在config.toml中添加hasCJKLanguage = true才能發(fā)揮更好的效果。）
當(dāng)然你也可以在文章內(nèi)使用針對文章手動進(jìn)行摘要提取，在之前出現(xiàn)的內(nèi)容都會作為摘要使用，且能夠保持渲染后的結(jié)構(gòu)而不是純文字版本。
Shortcodes
Shortcodes幫助你在編寫markdown時快捷的插入HTML代碼，功能上類似于Hexo的標(biāo)簽插件。
{ {< ref "blog/post.md" >}} => https://example.com/blog/post/
{ {< ref "post.md#tldr" >}} => https://example.com/blog/post/#tldr:caffebad
{ {< relref "post.md" >}} => /blog/post/
{ {< relref "blog/post.md#tldr" >}} => /blog/post/#tldr:caffebad
{ {< ref "#tldr" >}} => #tldr:badcaffe
{ {< relref "#tldr" >}} => #tldr:badcaffe
上述代碼通過內(nèi)置的rel與relref幫助你快速引用站點內(nèi)的其他文章。
注意: 如果你的 content/ 目錄下有多個同名的文件，引用該文章必須使用 blog/post.md 這樣的相對路徑而不是只提供 post.md 這樣的文件名。
hugo還內(nèi)置了instagram、tweet、youtube等Shortcodes，可以閱讀官方文檔了解更多信息，你使用的主題可能也會提供Shortcodes，當(dāng)然你也可以定制你自己的Shortcodes。
分類系統(tǒng)
默認(rèn)情況下即tags與categories，通常來說這已經(jīng)足夠我們使用了，但你也可以在config.toml文件中添加下面的代碼來添加更多的分類。
[taxonomies]
tag = "tags"
category = "categories"
series = "series"
部署Hugo
在GitHub上創(chuàng)建一個名為shongsheng.github.io的 Repository (shongsheng是你的github用戶名), 并在根目錄執(zhí)行如下命令，生成最終頁面：
$ hugo --theme=hyde --baseUrl="http://coderzh.github.io/"
注意，以上命令并不會生成草稿頁面，如果未生成任何文章，請去掉文章頭部的 draft=true 再重新生成。）
如果一切順利，所有靜態(tài)頁面都會生成到 public 目錄，將pubilc目錄里所有文件 push 到剛創(chuàng)建的Repository的 master 分支。
$ cd public
$ git init
$ git remote add origin https://github.com/coderzh/coderzh.github.io.git
$ git add -A
$ git commit -m "first commit"
$ git push -u origin master
參考鏈接
https://themes.gohugo.io
https://www.gohugo.org/theme hugo主題
https://gohugo.io/getting-started #官方文檔
