如何让Quarto列表中reveal.js幻灯片链接在新标签页打开？

更新： 此问题已作为需求提交至相关讨论区！

问题背景 #

我用Quarto搭建博客，所有文章都是reveal.js幻灯片，通过index.qmd的listing特性自动列出posts/文件夹内的内容。但打开reveal.js幻灯片后，无法轻松返回主索引页切换其他内容——普通文章可通过浏览器返回或站点导航正常返回，仅演示文稿存在此问题。

我尝试在index.qmd的listing配置中添加format字段自定义链接格式，但报错Property name 'format' is invalid，因此寻求动态为listing链接添加target="_blank"的方法。

解决方案 #

方法1：使用Lua过滤器修改链接属性

创建一个Lua过滤器文件（比如links-target-blank.lua），自动为指向posts/目录的链接添加target="_blank"：

function Link(el)
  -- 匹配posts目录下的文章链接
  if string.find(el.target, "posts/") then
    el.attributes.target = "_blank"
    el.attributes.rel = "noopener noreferrer" -- 可选，增强安全性
  end
  return el
end

在index.qmd的YAML配置中引入该过滤器：

---
listing:
  contents: posts
  sort: "date desc"
  type: default
  image-placeholder: "images/logo.png"
  categories: true
  sort-ui: false
  filter-ui: false
filters:
  - links-target-blank.lua
---

方法2：通过JavaScript动态修改链接

在index.qmd的末尾添加一段JavaScript代码，页面加载完成后自动为目标链接添加属性：

<script>
document.addEventListener('DOMContentLoaded', function() {
  // 选中所有指向posts目录的链接
  const postLinks = document.querySelectorAll('a[href^="posts/"]');
  postLinks.forEach(link => {
    link.setAttribute('target', '_blank');
    link.setAttribute('rel', 'noopener noreferrer');
  });
});
</script>

这种方法无需修改Quarto核心配置，快速生效。

方法3：自定义Listing模板（进阶）

如果需要更深度的自定义，可以修改Quarto的listing模板：

1. 在项目根目录创建_extensions/custom-listing目录
2. 复制Quarto默认的default类型listing模板到该目录（可在Quarto安装路径的resources/templates/listing下找到）
3. 修改模板中的链接代码，添加target="_blank"属性：

   <a href="{{path}}" target="_blank" class="listing-title">{{title}}</a>
   

4. 在index.qmd的listing配置中指定使用自定义模板：

   ---
   listing:
     contents: posts
     sort: "date desc"
     type: custom-listing::default
     # 其他配置...
   ---
   

注意事项 #

• 三种方法均为动态解决方案，无需手动逐个编辑文章链接
• 添加rel="noopener noreferrer"是安全最佳实践，避免新标签页对原页面的潜在影响
• 方法1和方法3对Quarto渲染过程生效，方法2在客户端浏览器生效

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