什么是 Hugo Hugo 是一个用 Go 语言编写的静态网站生成器。它具有简单、易用、高效、易扩展和快速部署等特点。与其他动态网站生成系统（如 WordPress、Ghost 和 Drupal）不同，Hugo 在创建内容时就已经生成了静态页面，这大大优化了网站的访问速度，并提供了出色的写作体验。 Hugo 适用于构建各种高性能的静态网站，特别是博客、文档和个人网站等。它使用简单的 Markdown 和 HTML 等标记语言来创建内容，并使用 Go 语言的模板引擎来自定义主题和布局。这使得用户能够轻松地创建和定制自己的网站。 Hugo 还具有跨平台性，可以在不同的操作系统上运行，包括 Windows、Linux 和 macOS 等。它对于资源消耗较低，不依赖昂贵的运行环境，如 Ruby、Python 或 PHP，也不依赖任何数据库。这使得 Hugo 成为一个轻量级且易于维护的网站生成器。 另外，Hugo 还支持多种部署方式，可以将生成的静态网站部署到各种托管服务上，如 Heroku、GoDaddy、DreamHost、GitHub Pages、Google Cloud Storage、Amazon S3 和 CloudFront 等。这使得用户能够灵活地选择适合自己的托管方案。 在使用 Hugo 时，用户可以通过简单的命令行操作来创建和管理自己的网站项目。Hugo 提供了丰富的命令和选项，使得用户能够轻松地生成、预览和部署网站。 总的来说，Hugo 是一个功能强大、易用和高效的静态网站生成器，适用于个人和小型团队搭建高性能的网站。它提供了优秀的写作体验、快速的网站访问速度和灵活的部署选项，使得用户能够轻松地创建和管理自己的静态网站。 配置环境 Linux Linux 用户可以直接使用包管理器安装 apt, yum, dnf, zypper, pacman 等等, 包名就是 hugo Windows Windows 用户可以在 GitHub 的 release 下载对应的安装包。 在下载安装包时，有 hugo 和 hugo_extended 两种可运行文件下载，其中 hugo 仅支持 js，hugo_extended 是 hugo 的扩展版本，在支持 js 的基础上还支持 ts。 解压后将 hugo.exe 的路径添加到系统环境变量 Path 中。 创建站点 使用命令 hugo new site blog 即可创建一个名称为 blog 的 hugo 站点项目，存放目录就是 blog。如果想在当前目录下创建需要加上--force参数，也就是hugo new site . --force。创建的项目默认使用的是 toml 配置文件，我比较喜欢用 yaml，所以呢，加一个参数：hugo new site blog --format yaml 目录结构： $ tree . -A . ├── archetypes │ └── default.md ├── assets ├── content ├── data ├── hugo.yaml ├── i18n ├── layouts ├── static └── themes 8 directories, 2 files 然后可以从主题站 https://themes.gohugo.io/ 选择一款主题。 下载到的主题解压到 themes 目录（带着主题根文件夹），然后就可以使用了。 配置站点 通常获取到的主题都会提供示例，里边会有配置文件 config.toml 或 hugo.toml，扩展名也可能是 yaml 等。按照这个文件修改我们站点根目录下的配置文件即可。 发布内容 使用以下命令创建一篇内容： hugo new posts/article.md posts：自定义的一个文件夹，当然也可以是别的，或者不指定文件夹都可以。 article.md：文章文件名，运行 hugo 时将会被渲染成一个页面。 生成的文件会被存放到 content 目录中。 自动生成的内容文件： +++ title = 'Article' date = 2024-01-10T00:53:04+08:00 draft = true +++ 这个自动生成的内容是 markdown 的 front-matter，这里是 toml 格式的，也可以手工改成 yaml 格式的。 实际上没必要使用 hugo new 命令创建内容，直接在相应目录手工创建 markdown 文件就行了。这里只是为让大家了解一下标准做法。 需要注意一下这里的 draft 参数，它是草稿的意思。如果发布时没有用 --buildDrafts，那么这个内容是不不会被渲染的。发布时改成 false 即可。 调试站点 如何在本地查看运行效果呢？在站点根目录运行 Windows 命令行 或 git bash 都可以，执行命令： hugo server --buildDrafts ... | EN -------------------+----- Pages | 3 Paginator pages | 0 Non-page files | 0 Static files | 0 Processed images | 0 Aliases | 0 Sitemaps | 1 Cleaned | 0 Built in 4 ms Environment: "development" Serving pages from memory Running in Fast Render Mode. For full rebuilds on change: hugo server --disableFastRender Web Server is available at http://localhost:1313/ (bind address 127.0.0.1) Press Ctrl+C to stop --buildDrafts：构建时包含标记为 draft（草稿） 的内容 默认使用了 --watch 参数，可以在修改文章内容时让浏览器自动刷新 根据提示，在浏览器中打开网址 http://localhost:1313/ 即可查看网页结果。上边创建的那篇内容的 URL 则是：http://localhost:1313/posts/article/ 发布站点 本地调试完后就可以生成静态页面，然后传到服务器了。 生成静态页面的指令 ： hugo --gc --minify --cleanDestinationDir --gc：开启在构建之后运行某些清理任务（例如删除无用的缓存文件） --minify：对任何能够支持的输出格式（HTML、XML 等）进行压缩 --cleanDestinationDir： 先删除目标文件夹中的文件，不然改为 draft 的生成文件不会被自动删除 将 public 文件夹中生成的所有文件上传服务...
包含 Web 标签的文章
修改 Nginx 附件大小的限制
Nginx 默认限制请求附件大小为 1MB。即：默认当你通过 Nginx 代理上传附件，大于 1M 的文件时，浏览器会抛出异常。 可以通过设置 nginx.conf 中的 http 块，添加或修改 client_max_body_size 参数来更改默认的附件大小限制。例如，将 client_max_body_size 设置为 8m，即可将附件大小限制更改为 8MB。这将影响到所有站点。当然也可以只修改某一个站点的配置，在站点的 server 块中添加或修改 client_max_body_size 即可。 修改后检查配置文件的语法是否正确：sudo nginx -t。如果没有显示语法错误，继续下一步；如果有错误，请检查配置文件并修复错误。 然后重新加载 Nginx 配置：sudo service nginx reload 或者 sudo systemctl reload ngi...
PHP 附件大小限制的修改
在 PHP 中设置附件大小限制，可以通过以下两种方式实现： 修改 php.ini 文件 在 php.ini 配置文件中，可以修改 post_max_size 和 upload_max_filesize 两个参数来分别限制 POST 数据和上传文件的大小。 这两个参数的区别： post_max_size: 这个参数定义了通过 POST 方法（例如表单提交）可以上传到服务器的数据的最大大小。 如果上传的文件大于这个值，服务器会返回一个错误。 这个限制包括了所有的 POST 数据，不仅仅是文件上传。例如，如果你在表单中填写了一些文本字段，这些数据也会被计入 post_max_size 的限制。 upload_max_filesize: 这个参数定义了通过 HTTP POST 方法上传的单个文件的最大大小。 这是对文件上传的限制，不包括其他非文件数据。 如果上传的文件超过了此限制，服务器会返回一个错误。 总结： post_max_size 是对整个 POST 数据（包括文件和其他表单字段）的限制。 upload_max_filesize 是对单个上传文件的限制。 为了确保文件上传的正常工作，通常建议： post_max_size 应该大于或等于 upload_max_filesize。 post_max_size 可以设置为更大的值以允许更多的其他 POST 数据。 例如： post_max_size = 64M upload_max_filesize = 32M 这里将 POST 数据限制为 64MB，上传文件限制为 32MB。 需要注意的是，修改 php.ini 文件需要重启 Web 服务器才能生效。 使用 ini_set 函数 在 PHP 脚本中，也可以使用 ini_set 函数动态地修改上传文件大小限制。例如： ini_set('post_max_size', '64M'); ini_set('upload_max_filesize', '32M'); 这里同样将 POST 数据限制为 64MB，上传文件限制为 32MB。 需要注意的是，在使用 ini_set 函数时，必须在 PHP 脚本执行的早期调用该函数，否则可能无法生效。这些设置只对当前脚本有效，并不会影响 PHP 的全局设置或其它脚本。另外，某些操作系统和 Web 服务器可能会对 ini_set 函数进行限制，需要进行相应的配置或授...
使用 Certbot 获取 Let’s Encrypt 证书
Let’s Encrypt https://letsencrypt.org/ Let’s Encrypt is a free, automated, and open Certificate Authority. Certbot Automatically enable HTTPS on your website with EFF's Certbot, deploying Let's Encrypt certificates. Install: On Ubuntu systems, the Certbot team maintains a PPA. Once you add it to your list of repositories all you'll need to do is apt-get the following packages. $ sudo apt-get update $ sudo apt-get install software-properties-common $ sudo add-apt-repository ppa:certbot/certbot $ sudo apt-get update $ sudo apt-get install python-certbot-nginx $ sudo certbot --nginx $ sudo certbot renew --dry-run #自动更新 执行该命令会创建系统级 cron 任务：/etc/cron.d/certbot，会每天检查两...
在 Hugo PaperMod 主题中加入数学支持的最简方式
目的：在不修改主题的情况下支持数学公式。 在当前的写作仓库内创建 layouts/partials/math.html 文件，写入以下内容： <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.16.2/dist/katex.min.css" integrity="sha384-bYdxxUwYipFNohQlHt0bjN/LCpueqWz13HufFEV1SUatKs1cm4L6fFgCi1jT643X" crossorigin="anonymous"> <script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.2/dist/katex.min.js" integrity="sha384-Qsn9KnoKISj6dI8g7p1HBlNpVx0I8p1SvlwOldgi3IorMle61nQy4zEahWYtljaz" crossorigin="anonymous"></script> <script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.2/dist/contrib/auto-render.min.js" integrity="sha384-+VBxd3r6XgURycqtZ117nYw44OOcIax56Z4dCRWbxyPt0Koah1uHoK0o4+/RRE05" crossorigin="anonymous"></script> <script> document.addEventListener("DOMContentLoaded", function() { renderMathInElement(document.body, { // customised options // • auto-render specific keys, e.g.: delimiters: [ {left: '$$', right: '$$', display: true}, {left: '$', right: '$', display: false} ], // • rendering keys, e.g.: throwOnError : false }); }); </script> 其中的 display 属性指是否显示为块级元素， $ ... $ 用于行内公式，所以为 false。 然后创建 layouts/partials/extend_head.html 文件，写入以下内容： {{ if or .Params.math .Site.Params.math }} {{ partial "math.html" . }} {{ end }} 这样可以通过在文章 front matter 中设置 math 属性 true/false 来按需加载数学公式资源。 --- title: 文章标题 date: tags: math: true --- 在使用某些主题时，比如 PaperMod，会自动从站点的 layouts/partials/extend_head.html 调用局部模...
时间造成的 Hugo 页面无法渲染问题
使用 Hugo 写博客，凌晨发布文章的时候总发不出来，什么原因呢？难道半夜见鬼了？👻 --- title: 文章标题 date: "2023-12-27" draft: false --- Hugo 默认采用的是 UTC，比北京时间 (UTC+8) 晚了 8 个小时。hugo 命令在生成静态页面的时候，默认不会生成超过当前时间的文章。所以，有三个方法可以解决问题： 可以在命令行加 --buildFuture 来生成未来的文章； 文章的 date 采用更标准的写法，采用 ISO 8601 日期时间表示法，带上时区信息； 例如：2023-12-27T17:52:08+08:00，其中的 +08:00 表示的就是北京时间了。 配置文件中增加配置 timeZone: Asia/Shangha...
Chrome 报错：ERR_UNSAFE_PORT
问题 在使用一个自定义端口 6000 提供网络服务时，总是无法访问。一开始没有留意具体的报错信息，觉得是不是服务程序没有打开端口，是不是路由器没有映射端口，是不是防火墙屏蔽了端口……，直到看到一行小字：ERR_UNSAFE_PORT 无法访问此网站 网址为 http://test:6000/ 的网页可能暂时无法连接，或者它已永久性地移动到了新网址。 ERR_UNSAFE_PORT 用 IE 浏览器试了一下确实能正常打开，看来就是 Chrome 的问题了。查了一下资料，我用的这个 6000 端口确实是个特殊端口。看来不止 Chrome，Edge 也有同样的问题喽。Firefox 的端口略有不同，也有所限...
使 DiscuzX 3.4 论坛支持代码高亮的改造方法
这里使用了 highlight.js，它的特点： 支持 196 种语言，242 种样式（绝大多数用不上） 自动语言探测（正确率似乎一般） 支持使用任意 HTML 标记 兼容任意 js 框架 只需要知道它足够牛就OK了。 可以通过 CDN 加速服务器引用： <link href="https://cdn.bootcdn.net/ajax/libs/highlight.js/11.2.0/styles/default.min.css" rel="stylesheet"> <script src="https://cdn.bootcdn.net/ajax/libs/highlight.js/11.2.0/highlight.min.js"></script> 如果需要裁剪定制一些语言，可以直接在官网下载页面（https://highlightjs.org/download/）操作： 下载后将 highlight.min.js 和样式表 default.min.css （也可以换用其他样式表）上传到服务...
mkcert 本地 HTTPS 加密证书工具
mkcert 是一个使用 GO 语言编写的生成本地自签证书的小程序，具有跨平台，使用简单，支持多域名，自动信任 CA 等一系列方便的特性可供本地开发时快速创建 https 环境使用。 https://github.com/FiloSottile/mkcert Ubuntu 中安装 sudo apt install libnss3-tools wget https://github.com/FiloSottile/mkcert/releases/download/v1.3.0/mkcert-v1.3.0-linux-amd64 mv mkcert-v1.3.0-linux-amd64 mkcert chmod +x mkcert cp mkcert /usr/local/bin/ 生成并将根 CA 证书加入本地可信 CA mkcert -install Using the local CA at "/home/matt/.local/share/mkcert" ✨ The local CA is now installed in the system trust store! ⚡️ ls /home/matt/.local/share/mkcert rootCA-key.pem rootCA.pem 生成网站的证书 mkcert 192.168.1.172 将证书部署到网站后，服务器本机访问： curl -I https://192.168.1.172:8888 已经不提示证书错误了。 客户机访问仍提示证书错误（不能验证证书）。 将 rootCA.pem 副本命名为 rootCA.crt 发给客户端用户，手动导入到“受信任的根证书颁发机构”。 重启浏览器后访问网站可以看到连接变成安全的了...