搭建静态博客01: Hugo

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

@
搭建静态博客01: 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 # 产生最后需要部署的网站文件

Next

  1. 基于S3及CloudFront,部署静态博客
  2. 进一步修改hugo.toml配置文件, 更新about/me.md个人介绍页面。

Reference

© 2025 - 2026 Leona的田园牧歌

🌱 Powered by Hugo with theme Dream.

关于我

Leona

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