從Hexo遷移到Hugo-送漂亮的Hugo Theme主題

自從Hugo出來後，做爲Go語言（golang）的重度用戶的重度用戶，一直想把本身的博客遷移到Hugo，可是一直沒有行動，主要緣由在於，個人博客使用的一款主題maupassant很是簡潔、響應速度快，可是在Hugo上並無相似一的主題，再加上從Hexo遷移到Hugo還有好多要修改的，因此一直遲遲沒有行動。

Hugo的maupassant主題

前段時間在Github上閒逛，居然發現了有人基於Hugo製做了maupassant主題，就clone下來看了一下，發現的確實現了maupassant主題的大部分功能，能夠用，可是也存在不少問題。

好比：

1. 不支持最近文章，我如今的Hexo的maupassant主題是支持的。
2. 分類不支持文章數量的顯示。
3. 不支持標籤雲
4. RSS支持，可是不能自動被發現。
5. 有菜單，可是不是Hugo的菜單功能，靈活性不足。
6. 不支持友情連接。
7. 沒有文檔歸檔功能。
8. GA統計分析不支持。
9. 沒有代碼高亮。

其餘小細節還有不少，這裏就不一一列舉了，總之，若是按這個模板進行遷移，那麼個人博客網站原來的不少功能都沒有了，這是我不能接受的。

完善Hugo的maupassant主題

既然不少功能都不支持，並且我又想遷移到Hugo（能夠利用go語言的知識，NodeJS不太熟），因此就自定動手參照着我原來博客的功能模板進行完善。原來的maupassant主題做者已經7個多月沒有維護了。

由於太忙，斷斷續續改了很久（一個多月吧），進行了擴展，增長了不少功能，而且用本身的博客作了實驗，基本上已經知足我所需的大部分功能，具體效果能夠參加 http://www.flysnow.org/ 。

飛雪無情版本的Hugo maupassant 主題開源。

完善了maupassant主題後，我決定進行開源，主要緣由有如下幾點：

1. 原maupassant主題有不少缺陷和功能缺失
2. 原做者最近7個多月沒有更新，並且沒有詳細的使用文檔。
3. 相信還有不少和我同樣的人，想用Hugo的這款maupassant主題。
4. 和更多的朋友一塊兒完善該主題。

基於此，因此我fork了原來的maupassant主題，把我修改的提交了上去，造成了新的flysnow hugo maupassant theme。

新的Hugo maupassant 主題主要有如下特性支持

• 最近發表的文章支持，顯示最近的10篇
• 分類支持，而且能夠顯示分類內的文章數量
• 標籤雲支持
• 一鍵回到頁面頂部
• RSS支持，而且能夠自動發現RSS
• 自定義菜單支持，不限個數，自定義排序
• 自定義友情連接支持
• 支持文章按年份日期進行歸檔
• 支持GA分析統計
• Sitemap站點地圖
• 支持關鍵字SEO優化
• 代碼高亮
• Google站內搜索

固然還有不少特性不支持，好比百度分析、文章閱讀數統計，評論等，後面會繼續完善。

什麼是Hugo

引用一下Hugo官網的描述

The world’s fastest framework for building websites.

Hugo是一個很是受歡迎的、開源的靜態網站生成工具，和Hexo相似。 它速度快，擴展性強。

更多的關於Hugo的介紹，請參考Hugo的官網 https://gohugo.io/ 。

Hugo的安裝和使用。

Hugo比Hexo速度更快，並且不用依賴一大堆東西，一個二進制文件就能夠搞定。

Github下載

咱們能夠直接從Github Release頁面下載對應的二進制文件,而後把它放在你的PATH目錄裏便可使用。這個支持任何平臺，根據本身的平臺選擇相應的二進制包便可。

Mac平臺下

Mac下Hugo提供了homebrew安裝的方式，很是簡便。

brew install hugo

Debian and Ubuntu平臺下

sudo apt-get install hugo

Windows平臺下

Windows下Hugo提供了Chocolatey方式的安裝，經過以下命令便可。

choco install hugo -confirm

驗證安裝

安轉完成後，咱們打開終端，輸入以下命令進行驗證是否安裝成功

hugo version

若是沒問題的話，會輸出Hugo的版本號等一些信息。

建立一個站點

hugo new site blog

添加一個主題

cd blog;\
git init;\
git submodule add https://github.com/budparr/gohugo-theme-ananke.git themes/ananke;\

# Edit your config.toml configuration file
# and add the Ananke theme.
echo 'theme = "ananke"' >> config.toml

添加一篇文章

hugo new posts/my-first-post.md

運行查看效果

hugo server -D

而後咱們就能夠打開瀏覽器，輸入http://localhost:1313查看咱們新建立的站點了。

本文爲原創文章，轉載註明出處，歡迎掃碼關注公衆號 flysnow_org或者網站 http://www.flysnow.org/，第一時間看後續精彩文章。以爲好的話，順手分享到朋友圈吧，感謝支持。

使用新的Hugo maupassant主題

最新版本的Hugo maupassant主題我已經在Github上開源，你們能夠clone使用。使用很簡單，只須要如下兩步便可。

cd <YOUR Bolg Root Dir>
git clone https://github.com/rujews/maupassant-hugo themes/maupassant

而後在Hugo的配置文件裏config.toml(yaml,json)中進行以下配置，便可使用。

theme = "maupassant"

記得把你的MD文章放在content/post目錄下。

Hugo maupassant 主題配置

Hugo maupassant 主題配置也不難，是否熟悉Hugo均可以快速配置，並生成本身的網站。
我博客的配置以下，你們能夠參考。

config.toml

baseURL = "http://www.flysnow.org"
languageCode = "zh-CN"
title = "飛雪無情的博客"
theme = "maupassant"

[author]
  name = "飛雪無情"

[params]
  author = "飛雪無情"
  subtitle = "專一於Android、Java、Go語言(golang)、移動互聯網、項目管理、軟件架構"
  keywords = "golang,go語言,go語言筆記,飛雪無情,java,android,博客,項目管理,python,軟件架構,公衆號,小程序"
  description = "專一於IT互聯網，包括但不限於Go語言(golang)、Java、Android、Python、項目管理、抖音分析、軟件架構等"

Hugo maupassant 自定義菜單

原做者的菜單是基於Content Type實現的，擴展性不好。Hugo自己有菜單的支持，擴展性更好，因此我改成基於Hugo原生菜單的方式實現，能夠無限級擴展、支持菜單排序。

config.toml

[menu]
  [[menu.main]]
    identifier = "books"
    name = "新書"
    url = "/books/"
    weight = 2
  [[menu.main]]
    identifier = "archives"
    name = "歸檔"
    url = "/archives/"
    weight = 3
  [[menu.main]]
    identifier = "about"
    name = "關於"
    url = "/about/"
    weight = 4

identifier標誌符必須是惟一的，不能重複；weight用於排序，值越小越靠前。

Hugo maupassant 友情連接

友情連接的實現也是遵循Hugo原生的方式，參考配置以下：

config.toml

[[params.links]]
  title = "Android Gradle權威指南"
  name = "Android Gradle權威指南"
  url = "http://yuedu.baidu.com/ebook/14a722970740be1e640e9a3e"
[[params.links]]
  title = "經常使用開發工具CDN鏡像"
  name = "經常使用開發工具CDN鏡像"
  url = "http://mirrors.flysnow.org/"

params.links是一個數組，因此咱們能夠自定義不少友情連接。name表示顯示的連接文本，title表示鼠標懸停在友情連接時，顯示的文本。

Hugo maupassant 文章歸檔支持

Hugo默認是不支持生成歸檔文件的，須要本身實現。新主題已經實現了文章歸檔，只須要在新建content/archives/index.md文件，文件內容爲：

content/archives/index.md

title: "歸檔"
description: Android資深工程師 ，Go和Java打雜師，《Android Gradle權威指南》做者，Android官方技術文檔譯者
type: archives

title和description均可以換成你本身的，可是type必須是archives。

content/archives/index.md表示在content/archives/目錄下的index.md文件

這樣Hugo就會自動生成/archives/index.html歸檔頁面，經過相似http://www.flysnow.org/archives/的URL進行訪問，目前的歸檔是按照年份進行歸檔，後面能夠擴展更多的歸檔方式。

其餘靜態文件

有些不須要咱們轉化的靜態文件，好比robots.txt、咱們上傳的附件等，這些不須要Hugo進行處理，能夠直接放在static目錄下，Hugo會原封不動的拷貝。

從Hexo到Hugo踩的坑

從Hexo到Hugo踩了一些坑，這裏主要介紹一些主要的。

第一個坑就是URL連接。

對於從Hexo遷移到Hugo來講，比較重要的就是保持URL連接的一致性，這樣已經被搜索索引，其餘文章引用的文章才能夠繼續被打開，不然就會出現404錯誤。

我之前使用Hexo的博客，文章連接是使用的permalink設置優化的URL，好比：

permalink: :year/:month/:day/:title.html

這樣咱們博客文章所有都是這樣年月日+標題+html後綴的格式，好比Go語言參數傳遞是傳值仍是傳引用這篇文章，http://www.flysnow.org/2018/02/24/golang-function-parameters-passed-by-value.html。
只有文章是html後綴的格式，分類、標籤等聚合頁是目錄Path的格式，如：http://www.flysnow.org/categories/Golang/。

在新的Hugo系統中，我也想這麼作，可是Hugo的permalink是不能配置html後綴的，便可你配置了，也只會生成以下的URL/year/month/day/title.html/仍是一個目錄，沒法以.html結尾。

我查了下Hugo的文檔，發現有個配置能夠解決，這就是在config.toml裏設置uglyurls = true。
這樣的確解決了以.html結尾的問題，可是又引出來另一個問題，就是分類、標籤等也是以.html結尾了，變成了http://www.flysnow.org/categories/Golang.html，查了不少文檔，魚和熊掌不可兼得（有知道的朋友必定要告訴我，多謝）。

最終我採用了指定文章URL的方式，不用uglyurls = true配置了。在每篇文章裏的Front Matter加上

url: /2018/02/24/golang-function-parameters-passed-by-value.html

強制指定文章的URL，這樣就解決了從Hexo到Hugo遷移帶來的問題。

第二個坑是分類名稱

咱們在寫文章的時候，會給文章進行分類，好比Golang，可是默認狀況下，Hugo會把這個Golang轉爲小寫，這就給咱們一直用原始字符的形成困擾，爲了解決這個問題，Hugo提供了preserveTaxonomyNames配置，把它設置爲true就能夠了保持原來分類的名字了。

config.toml

## 保持分類的原始名字（false會作轉小寫處理）
preserveTaxonomyNames = true

第三個坑就是URL路徑

Hugo默認狀況下，URL字符串裏的字母都會強制轉爲小寫，這對於分類名、標籤名是大寫的來講，博客遷移後（好比從Hexo到Hugo），原來的連接就失效了，爲了解決這個問題，Hugo提供了disablePathToLower配置。

config.toml

## 是否禁止URL Path轉小寫
disablePathToLower = true

貢獻

最後歡迎你們貢獻和支持，多star，多PR，多提ISSUE，等着大家。https://github.com/rujews/maupassant-hugo

本文爲原創文章，轉載註明出處，歡迎掃碼關注公衆號 flysnow_org或者網站 http://www.flysnow.org/，第一時間看後續精彩文章。「防賤人刪除版權」以爲好的話，順手分享到朋友圈吧，感謝支持「uuuuuuuu」。