如何在Hugo中为段落添加CSS类？配置为何未生效？

问题原因 #

Hugo默认的Goldmark渲染器关闭了块级元素的属性解析功能，所以你写的{.font-normal .text-lg}语法不会被识别为段落的class属性，而是被当成普通文本输出。

解决步骤 #

修改你的Hugo配置文件（根据你使用的配置格式选择对应代码）：

若使用config.toml：

[markup]
  [markup.goldmark]
    [markup.goldmark.parser]
      [markup.goldmark.parser.attribute]
        block = true  # 开启块级元素（比如段落）的属性支持
        title = true  # 可选，开启标题元素的属性支持

若使用config.yaml：

markup:
  goldmark:
    parser:
      attribute:
        block: true
        title: true

若使用config.json：

{
  "markup": {
    "goldmark": {
      "parser": {
        "attribute": {
          "block": true,
          "title": true
        }
      }
    }
  }
}

验证与注意事项 #

1. 确保属性语法无误：属性块{.font-normal .text-lg}必须和段落文本紧挨着，中间不能有空行，且单独占一行
2. 修改配置后重启Hugo开发服务器或重新构建项目，即可生成你期望的代码：

<p class="font-normal text-lg">This is some paragraph text.</p>

内容的提问来源于stack exchange，提问作者J86