搭建 Hugo 博客 (1)—

开启新的语言 Golang 学习之旅。

从学习的角度思考，要学习 Golang，那最好的边学习边记录。能起到记录作用的，首当其冲的是搭建 blog 来随时记录。

所以，我们还是开始使用 Golang 语言的 Hugo 框架来建立我自己的学习 blog。

安装 Hugo

在 Mac 本地，先安装 Hugo 框架：

brew install hugo

初始化网站：

❯ hugo new site gohome
Congratulations! Your new Hugo site was created in /Users/**/Code/GolandProjects/gohome.

Just a few more steps...

1. Change the current directory to /Users/**/Code/GolandProjects/gohome.
2. Create or install a theme:
   - Create a new theme with the command "hugo new theme <THEMENAME>"
   - Or, 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/.

建立私有 Github 库 (repository)。如果只是单纯的使用 Hugo 来建网站，那完全可以直接在服务器安装和操作。我们是为了学习 Golang 语言，了解和修改 Hugo 网站，这本身也是学习过程。

echo "# gohome" >> README.md
git init
git add README.md
git commit -m "first commit"
git branch -M main
git remote add origin git@github.com:**/**.git
git push -u origin main

或者：

git remote add origin git@github.com:**/**.git
git branch -M main
git push -u origin main

两者结合，先把代码提交到 Githbub 代码库中，为下一步在服务器上部署做准备。

安装主题

Hugo 已经是现象级的产品了，本身有大量的作者发布很多主题，在开始阶段，我们完全可以先使用别人写好的主题，未来在根据自己学习的过程，自创主题，分享给别人。

所有主题可见网站：https://themes.gohugo.io/tags/blog/

我选了一个比较好，并且符合我个人需要的主题：hugo-theme-dream

mkdir -p themes && cd themes
git clone https://github.com/AmazingRise/hugo-theme-diary diary

或者

git submodule add https://github.com/AmazingRise/hugo-theme-diary themes/diary

配置：

copyright = "This is a customized copyright."
theme = "diary"

# Generate sitemap in the public folder
[sitemap]
  changefreq = "always"
  filename = "sitemap.xml"
  priority = 0.5

# Google Analytics
[services]
  [services.googleAnalytics]
    id = "G-XXXXXXXXXX"  # Your Google Analytics ID

[markup]
  [markup.highlight]
    codeFences = true
    guessSyntax = false
    hl_Lines = ""
    lineNoStart = 1
    lineNos = false
    lineNumbersInTable = true
    noClasses = true
    style = "perldoc"
    tabWidth = 4

[params]
subtitle = "Themed by Diary."
enableGitalk = false
enableGiscus = true

# Microsoft Clarity (https://clarity.microsoft.com/) is a free user behavior recording and analytics tool
clarity = "abcdefghzd"

# Twitter Card and Open Graph settings
enableOpenGraph = true
enableTwitterCards = true
title = "My Blog" # will set 'og:site_name'
description = "My HomePage Description"  # will set 'og:description'

[params.gitalk]
  owner = "user"
  repo = "repo name"
  client_id = "your client id"
  client_secret = "your client secret"
[taxonomies]
   tag = "tags"
   category = "categories"

[params.utterances]
repo="your repo"
term="[ENTER TERM HERE]"
label="your label"
theme="github-light"

# Please visit https://giscus.app/ to generate settings.
[params.giscus]
    data_repo="username/repo"
    data_repo_id="**************************"    
    data_category="General"
    data_category_id="*********************"
    data_mapping="pathname"
    data_strict="0"
    data_reactions_enabled="1"
    data_emit_metadata="0"
    data_input_position="bottom"
    data_theme="preferred_color_scheme"
    data_lang="en"
    crossorigin="anonymous"


[[menu.main]]
url = "/categories"
name = "Categories"
weight = 2
[[menu.main]]
url = "/tags"
name = "Tags"
weight = 3
[[menu.main]]
url = "/posts"
name = "Archive"
weight = 1
[[menu.main]]
url = "/index.xml"
name = "RSS Feed"
weight = 4

测试

运行命令，即可查看效果

hugo server

发布

每个技术人，还是建议有一个属于自己的服务器，这样就可以随时发布博客内容，分享出去。在服务器上生成静态文件夹：

hugo 但怎么发布法，还是有挺多讲究的，我们下期分解。

最后修改于 2025-03-15