建個博客 - 本文屬於一個選集。

§ : 本文

——是不是每一個博客主的第一篇博文都會和自己建立博客的心路歷程有關啊。

說點廢話：

本篇以及後續的小文均不能算是嚴肅教程，充其量算我的一些記錄，目的是幫助想要建立靜態博客但完全沒有代碼基礎的朋友（我也沒有）少踩一些坑。

我會盡力把自己記憶中建立博客的過程貼上來，但仍可能會出現錯漏和不夠詳細的地方，請閱讀本篇的朋友不吝指正。

本篇的用語爲：繁體中文。

本篇主要內容：安裝 Hugo，並且把你的博客文件夾建起來！

…何爲 hugo
#

請參看HUGO 官方網站以及HUGO 中文文檔。

安裝 hugo
#

兩個版本：standard（標準版）與 extended（延展版），推薦安裝 extended edition。

Windows 系統下安裝
#

目前個人使用 Mac 較多，只細說一下 MacOS 下的安裝方式。之後可能會再把 Win 系統筆電上的安裝截圖補全在這一部分，這會兒暫時不貼啦果咩。官方安裝說明：Windows 系統下安裝

Windows 系統下需要注意兩點：

選擇正確的軟件版本
注意添加環境變量

MacOS 系統下安裝
#

官方安裝說明：MacOS 系統下安裝

或許你需要先安裝 Homebrew
#

方式 1: 通過終端機安裝
首先請安裝Homebrew。command + space搜索“terminal”（終端機），按照官網說明將如下內容貼入終端機：

/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

但，在沒有網絡條件的情況下可能會顯示“failed to connect …”之類的內容。此時可採用國內鏡像源下載安裝。
將如下內容複製貼入終端機：

/bin/zsh -c "$(curl -fsSL https://gitee.com/cunkai/HomebrewCN/raw/master/Homebrew.sh)"

選擇下載源並輸入密碼安裝即可（我記得我選擇的是中科大的源）。後期替換源就請另外搜索解決辦法啦，這方面我也不是專家><

方式 2: pkg 文件安裝
官網也說了最新版的 4.3.5 可以試試 pkg 文件安裝：https://github.com/Homebrew/brew/releases/tag/4.3.5 拖動安裝即可，簡單快捷！
安裝完成之後用brew update命令檢查狀態，再試試brew -v查看當前版本，確認 Homebrew 安裝完成。

安裝 Hugo
#

在終端機中輸入brew install hugo，完成後輸入hugo version，如果安裝成功會出現如下代碼：

hugo v0.123.0-3c8a4713908e48e6523f058ca126710397aa4ed5+extended darwin/arm64 BuildDate=2024-02-19T16:32:38Z VendorInfo=brew</span>

好了，hugo 安裝成功了，下一步：建立你的博客。

建個博客…主題是必須的嗎？
#

首先請確定要安装的文件夹。在終端機中輸入你想要保存博客文件夾的文件夾。比如，Documents（文件），此處示例我選擇存在 Documents 內的 personal 文件夾內。

cd Documents/personal

輸入hugo new site myblog（“myblog”是你給你的博客文件夾起的名字，請自由地替換）即會出現以下內容：

Congratulations! Your new Hugo site was created in /Users/Yourname/Documents/personal/myblog.

Just a few more steps...

1. Change the current directory to /Users/Yourname/Documents/personal/myblog.
2. Create or install a theme:
   - Create a new theme with the command "hugo new theme <THEMENAME>"
   - Install a theme from https://themes.gohugo.io/
3. Edit hugo.toml, setting the "theme" property to the theme name.
4. Create new content with the command "hugo new content <SECTIONNAME>/<FILENAME>.<FORMAT>".
5. Start the embedded web server with the command "hugo server --buildDrafts".

See documentation at https://gohugo.io/.
Yourname@YourMacBook personal %

點開 myblog 文件夾，可以發現整體架構大概是這樣的。

myblog
├── archetypes
│   └── default.md
├── assets
├── content
├── data
├── hugo.html
├── i18n
├── layouts
├── public
│   ├── categories
│   │   └── index.xml
│   ├── index.xml
│   ├── sitemap.xml
│   └── tags
│       └── index.xml
├── static
└── themes

博客文件夾分爲：
archetypes（內容模版框架）
assets（預設）
content（博文）
data（數據，但我不知道裝了什麼因爲我的文件夾目前是空的）
i18n（多語言支持）
layouts（全局樣式）
public（保存的編譯完成的 html 文件，同時也是對外發佈的內容）
static（靜態文件）
themes（主題）

此時的博客文件夾光禿禿一片，要添加一個主題才能看到博客效果。你可以選擇前往官方站點Hugo themes尋找一個你喜歡的主題，按照主題作者的說明來進行安裝使用。
（本博選用了Puppet作為母版來進行魔改，但該主題作者已經兩年沒有更新了，所以各位不一定要用這個主題嗷。）
按照主題作者的說明，可以選擇在根目錄下git init後git clone的方式，也可以簡單粗暴地直接複製整個文件夾的內容到博客文件夾根目錄。
複製完成後在根目錄中（cd myblog）輸入hugo server，hugo 就開始生成頁面了：

umi@MyMacBook-Pro blog % hugo server
Watching for changes in /Users/yourname/Documents/personal/myblog/{archetypes,assets,content,data,i18n,layouts,static}
Watching for config changes in /Users/yourname/Documents/personal/blog/hugo.toml
Start building sites …
hugo v0.123.0-3c8a4713908e48e6523f058ca126710397aa4ed5+extended darwin/arm64 BuildDate=2024-02-19T16:32:38Z VendorInfo=brew

                   | EN
-------------------+-----
  Pages            |  8
  Paginator pages  |  0
  Non-page files   |  0
  Static files     | 22
  Processed images |  0
  Aliases          |  1
  Cleaned          |  0

Built in 36 ms
Environment: "development"
Serving pages from disk
Running in Fast Render Mode. For full rebuilds on change: hugo server --disableFastRender
Web Server is available at http://localhost:1313/ (bind address 127.0.0.1)
Press Ctrl+C to stop

地址欄輸入上方這個地址：http://localhost:1313/，現在你應該就能看到個人網頁的雛形了：

肆意書寫本不需要太多鋪墊
#

如果對主題沒有什麼特殊要求只是想有個地方寫東西的話，這個時候把標題改改那麼你已經 ready to go 啦！打開根目錄下的 hugo.toml 文件，將標題中的 My New Hugo Site 改成自己喜歡的博客標題。

baseURL = 'https://example.org/'
languageCode = 'en-us'
title = 'My New Hugo Site'

終端機中輸入 cd myblog回到根目錄，輸入hugo new posts/my-first-post.md：

% hugo new posts/my-first-post.md
Content "/Users/Yourname/Documents/personal/blog/content/posts/my-first-post.md" created

這篇名爲my-first-post的博文就已經創建成功了。用編輯器打開這個 markdown 文檔後能看到模版是這樣的：

+++
title = "My First Post"
date = 2024-06-12T23:32:24+08:00
draft = true
description = ""
subtitle = ""
header_img = ""
short = false
toc = true
tags = []
categories = []
series = []
comment = true
+++

draft = true 就表示該博文現在是草稿狀態。在下面完成你的博文之後需要把它改成 false，才能成功發佈。

如果需要存檔頁面，按照主題作者的說明，在content文件夾下新建一個archive文件夾，文件夾中新建index_.md文檔即可顯示存檔頁面，這個頁面會出現在你的主頁，可以直接點擊進入。

---
title: Archive
description:
header_img: /img/archive-bg.jpg
short: true
---

寫好第一篇博文，一個最簡單的靜態博客就已算成功建立，至於日後賽博房間要如何裝修，刷什麼漆擺什麼物件，就全憑你自己的喜好來，裝修其實是個非常耗時耗精力（當然也非常有趣）的事情，並不一定要急於短時間內搞定。

主題推薦？和一些廢話
#

除了當前主題，其實個人最想用的是Seven這個主題，簡潔、優雅又富有設計感，但我幾個月前每次嘗試安裝+魔改就反覆報錯，可能是因爲完全看不懂 tailwind 的緣故，不知道改到哪就開始報錯了…
不過最近作者更新了主題，萬一我哪天又想起來折騰去魔改了呢…？（被拖走）

謝謝路過的讀者們耐心讀到這裏。下一篇更新會說一下本地博客託管到 github 怎麼操作以及我部署過程中踩的一些坑XD

建個博客 - 本文屬於一個選集。

§ : 本文

…何爲 hugo #

安裝 hugo #

Windows 系統下安裝 #

MacOS 系統下安裝 #

或許你需要先安裝 Homebrew #

安裝 Hugo #

建個博客…主題是必須的嗎？ #

肆意書寫本不需要太多鋪墊 #

主題推薦？和一些廢話 #