Hugo 静态博客搭建指南

一直想着建个自己的网站,顺便折腾点主题。前几天突发奇想注册了这个域名。顺手也把网站搭起来。调研了现在静态博客的情况,之前印象中的流行框架 HEXO 已然被 Hugo 盖住了风头。学习了下 Hugo,够简单,功能也够丰富。虽然网上 Hugo 搭建指南一大把,但我还是记录一下自己的使用过程,也作为第一篇正式博文。 你可以在这篇博客中了解到: Hugo 搭建静态博客方法 利用 github pages 托管网页 利用 github action 自动发布网页 一些建站过程中的 tips 安装Hugo Hugo的官网是https://gohugo.io/,另外有个中文文档网站https://gohugo.org/也可以参考。 官方推荐了很多安装方式,但我觉得直接下载二进制文件最为方便(升级需要手动),Hugo有标准版、扩展版两个版本,扩展版支持对 WebP 图像进行编码和使用嵌入式 LibSass 转译器将 Sass 转译到 CSS,官方也推荐使用扩展版。 下载后,放到对应路径,添加到 PATH 环境变量,更方便使用。安装完后,使用以下命令进行验证: hugo version 使用Hugo 生成站点 即在指定路径下生成名为 sitename 的文件夹 hugo new site /path/to/sitename 站点目录结构: ▸ archetypes/ ▸ content/ ▸ layouts/ ▸ static/ config.toml 创建文章 在content文件夹下新建posts文件夹并新建xx.md文档 hugo new posts/xx.md 默认生成的 xx.md 内容和解释如下: title: "xx" # 网站显示的文章名字,可以与文件名不同 date: 2021-08-19T15:04:55+08:00 draft: true # 是否为草稿 # 下面两个默认没有,需要自己加 categories: ["互联网"] # 文章分类 tags: ["Hugo", "Github Pages", "Github Actions", "CI/CD"] # 文章标签 一般情况下,我们都要新建这些文件构建网站的骨架:...

六月 12, 2023 · Beeta