Hugo + Github + Cloudflare Pages 搭建个人博客

前置准备

• GitHub 账号
• Git
• Markdown 文本编辑器

没有 GitHub 和 Git 的可以参考官方文档进行下载和配置，仓库可以先不创建。SSH 密钥建议配置，它的作用是验证身份合法性，这样每次拉取/推送代码时都无需再输入账号密码，且 SSH 传输比 HTTP 更安全。

后续博客编写及 Hugo 配置文件均使用 Markdown 语法，建议使用 Typora、Obsidian 或 VSCode 等编辑工具，记事本功能有限且不美观。

Hugo

Hugo 是世界上最快的静态网站构建框架之一，由 Go 语言实现，具有简单、易用、高效、易扩展的特点。

Hugo 下载

演示基于 Windows 11 系统。直接从 GitHub 下载最新版本的 extended 版本（如 v0.152.2），因为 Stack 主题需要 extended 版本才能完成全部功能搭建。

![图片]

1. 添加系统环境变量，将 hugo.exe 所在目录加入 PATH。
2. 打开命令行，输入 hugo version 测试安装是否成功。
3. 解压到便于操作的目录，例如 D:\HugoBlog。

创建新站点

1. 在命令行中进入目标目录，执行命令：

hugo new site yoursitename

2. 进入生成的站点目录：

cd yoursitename

3. 挑选主题。这里使用 Stack 主题。初始化 git 仓库，并从 GitHub 下载主题作为子模块：

git submodule add https://github.com/CaiJimmy/hugo-theme-stack/ themes/hugo-theme-stack

如果下载超时，可使用 Git Bash 重新执行上述命令。

成功后，themes 下会多出 hugo-theme-stack 文件夹。

配置 Stack 主题

1. 复制 theme/exampleSite 下的 content 文件夹和 hugo.yaml 配置文件到站点根目录，删除原有的 hugo.toml。
2. 注意：请删除 content/post/rich-content 文件夹，避免运行失败。
3. 本地调试：在站点目录下执行 hugo server -D，访问 http://localhost:1313/ 查看效果。
4. 创建第一篇博客：

hugo new post/first-blog/index.md

5. 修改配置文件 hugo.yaml。注意 YAML 格式缩进敏感。主要配置项如下：

baseurl: https://example.com/
languageCode: zh-cn
theme: hugo-theme-stack
title: 个人博客
copyright: zhim00
DefaultContentLanguage: 
 

  
     
     
     
    
      
         

   

  
     
   
   
   
  
     
  
     
    
       
       
       
  
     
     
     
    
       
           
    
       

  
    []