Hugo 博客中文指南(基礎教程)


1. 安裝 Hugo

從 Hugo 項目主頁下載 Releases 文件,解壓 hugo.exe 文件到 C:\Windows\System32 目錄下。

2. 創建站點

hugo new site mysite

新的站點文件夾 mysite 就自動生成到了當前目錄下:

在執行完 hugo new site 命令后你會得到一個包含以下文件的目錄。

.
├── archetypes/
├── config.toml
├── content/   # 儲存網站的所有文章內容
├── data/
├── layouts/   # 全局樣式,優先級高於主題下的 layouts 文件夾
├── static/    # 靜態文件,優先級高於主題下的 static 文件夾
└── themes/    # 主題目錄

3. 新建頁面和文章

新建一個 about 頁面:

hugo new about.md

about.md 自動生成到了 content/about.md,內容如下:

---
title: "About"
date: 2020-04-07T22:05:28+08:00
draft: true
---

創建第一篇文章,放到 post 目錄:

hugo new post/myfirst.md

myfirst.md 自動生成到了 content/post/myfirst.md,內容如下:

---
title: "Myfirst"
date: 2020-04-07T22:05:28+08:00
draft: true
---

其中 draft: true 表示為草稿文件,正式發布前需將值修改為 false,或者直接刪除 draft 整個參數,否則正式發布時不會生成文章。

4. 安裝主題

Hugo 主題列表 或從 Github 下載一款主題,解壓到 theme 目錄下:

  • 通過命令行的方式使用主題:hugo -t 主題目錄名
  • 通過在 config.toml 配置使用:theme = "主題目錄名"

5. 編譯輸出(構建 Hugo 網站)

在 Hugo 網站文件夾的根目錄下,執行 hugo 命令來構建。

hugo

編譯輸出的靜態 HTML 文件,默認會保存到 public 目錄。

6. 啟動實時預覽(本地預覽網站效果)

寫一篇文章生成一次會很繁瑣,可以通過啟動網站預覽,實時監控頁面的更改並刷新頁面。

hugo server -D

參數: -D 輸出包括標記為 draft: true 的草稿文章

默認地址為 http://localhost:1313 如果 1313 端口被占用,會隨機使用其他空端口。

參考閱讀


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM