如何在Quarto RevealJS演示中自定义h1幻灯片的章节编号？

你已经通过number-sections: true开启了章节编号，要自定义为1) chapter 1或Section 1: chapter 1，可以用以下两种方法实现：

方法一：使用CSS样式修改 #

RevealJS生成的章节编号通过CSS伪元素::before添加，直接自定义该伪元素的内容即可快速修改格式：

改为1) chapter 1格式 #

在文档YAML配置之后添加以下CSS代码块：

<style>
.reveal h1::before {
  content: counter(section) ") ";
}
</style>

改为Section 1: chapter 1格式 #

替换为如下CSS代码块：

<style>
.reveal h1::before {
  content: "Section " counter(section) ": ";
}
</style>

方法二：使用Lua过滤器修改（更彻底） #

如果需要从文档生成阶段就修改编号格式，避免依赖前端样式渲染，可使用Quarto的Lua过滤器：

1. 创建名为custom-section-number.lua的文件，内容如下：

function Header(el)
  if el.level == 1 then
    local number = el.attributes["number"]
    if number then
      -- 二选一：启用对应格式的代码行
      -- 格式1: 1) chapter 1
      el.content = pandoc.List({pandoc.Str(number .. ") ")}):extend(el.content)
      -- 格式2: Section 1: chapter 1
      -- el.content = pandoc.List({pandoc.Str("Section " .. number .. ": ")}):extend(el.content)
    end
    el.attributes["number"] = nil -- 移除默认编号，避免重复显示
  end
  return el
end

2. 在Quarto文档的YAML配置中引用该过滤器：

---
title: "Untitled"
format:
  revealjs:
    number-sections: true
    number-depth: 1
filters:
  - custom-section-number.lua
---

使用时注意注释掉不需要的格式代码行。

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