第一章:Hugo

2025-01-29T19:15:23-05:00 | 更新于 2025-02-05T21:10:23-05:00 | 3分钟阅读

@
第一章:Hugo

此搭建流程基于 Windows 11 环境,使用 Hugo + dream 主题搭建静态博客。

搭建基础

我不确定 Hugo 是否可以像普通 exe 文件那样下载安装,因为我随意搜索到的教程(大部分都是码农写的),是先安装 chocolatey,然后运行 choco install 安装 Hugo。 如果你搜索到其它方式也可以,总之,目标是 Windows 用户最后可以在 powershell 或 git bash(如果已经安装)中运行 hugo。

安装 Chocolatey

用管理员权限安装 chocolatey:

Get-ExecutionPolicy  # 确认状态是否是 Restricted
Set-ExecutionPolicy AllSigned  # 移除 Restricted 状态
[System.Net.ServicePointManager]::SecurityProtocol = [System.Net.ServicePointManager]::SecurityProtocol -bor 3072; iex ((New-Object System.Net.WebClient).DownloadString('https://community.chocolatey.org/install.ps1'))  # 下载并安装
choco  # 确认是否安装成功

安装 Hugo

安装 Hugo:

choco install hugo-extended -confirm

查看安装了的 Hugo 版本,以确认 Hugo 是否安装成功:

hugo version

Hugo 模板

选择主题

Hugo 主题网站 上有很多不同类型的主题可以选择。

随着 Hugo 越来越成熟,模板越来越多,使用模板的方式也多种多样。我个人建议没有太多编程经验的朋友,在选择自己喜欢的模板同时,查看下载页面上的安装教程,免得装了半天最后还要 debug,一鼓作气再而衰,直接放弃了。

我使用的是 dream 模板的 Zen 模式,有基础功能,页面简单,安装过程直接,还有非常完善的介绍页面 。反正后续想要添加别的功能,可以自己修改增补。 以下的安装步骤,可能不适用于所有的主题。

学有余力的朋友,也可以阅读一下这篇从零开始搭建 Hugo 博客 文章,详述了 Hugo 的基本逻辑。不论你想要修改现有的模板,还是找不到合适的不得不自己搭建网站(比如我就正在搭一个自己的相册网站),这篇文章都值得一看。

安装主题

创建文件夹结构和基础文件:

cd "C:\Your Path\your_blog_folder"  # 选择你想要存放博客文件的文件夹
hugo new site .  # 在当前文件夹下创建博客默认需要的文件夹结构及基础文件
git init  # 可选,如果不熟悉 Git 可以略过

运行hugo new site .后,我们会看到如下提示:

1. Change the current directory to C:\Your Path\your_blog_folder.
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".

按照上述提示,下载主题:

# 以下代码二选一  # 也可直接下载 repo 并移动到 dream 文件夹
git clone https://github.com/g1eny0ung/hugo-theme-dream.git themes/dream  # 下载 dream 主题并放在 ./themes/dream 文件夹下
git submodule add https://github.com/g1eny0ung/hugo-theme-dream.git themes/dream  # 或者作为 submodule 添加

hugo.toml配置文件中添加 theme:

theme = "dream"  # dream 为上一步安装的主题的文件夹名字

创建个人介绍页面,和你的第一篇博客。新页面会出现在 content 文件夹下:

hugo new about/me.md
hugo new posts/your_first_blog_post.md

然后就可以运行 hugo,并在浏览器中输入 http://localhost:1313/ 查看(没有配置好所以超级丑但是有内容的)网站:

hugo server     # 仅显示完成的文章
hugo server -D  # 显示完成的文章和草稿文章

以上步骤产生的网页仅供本地浏览。如果一切正常,运行以下代码,最后得到的 public 文件夹下的所有文件,就是需要部署的网站文件。

hugo # 产生最后需要部署的网站文件

Reference

© 2025 - 2026 Leona的田园牧歌

🌱 Powered by Hugo with theme Dream.

关于我

Leona

  • 女的。
  • INFJ。
  • 长毛象链接点这里!
  • 做了八年数据科学家,但是每次管自己叫”科学家“,都很羞愧。职业+J人,习惯把日常生活数据化。
  • 玩了十几年相机,三十岁以前拍人像擅长无痕修图,三十岁以后拍动物植物大自然。
  • 厌倦城市,旅行目标大多是看动物。
  • 嘴太叼,不好吃宁愿饿着,还好手艺不错,不会饿死自己。
  • 没体能天赋,从小长跑最后一名,但是热爱运动,练过跑步、举铁、泰拳、网球、crossfit,现在重心转向功能性训练。
  • 现阶段人生目标是找个山头归隐,自给自足,田园牧歌,种菜养花,遛猫逗狗,养鸡喂牛。