jekyll - 如何在 kramdown 中向标题添加永久链接？

Question

我正在使用 Jekyll 和用 Markdown 编写的 Github-Page 构建一个网站。我希望能够轻松地永久链接到标题，就像大多数在线文档所做的那样。

我想在单击标题时获取带有哈希值的 URL。在 Kramdown 或 Jekyll 的配置中是否有一种简单的方法可以实现此目的？

Markdown 页面

#### A regular header

A regular sentence.

理想结果

<h4 id="a-regular-header"><a href="#a-regular-header">A regular header</a></h4>
<p>A regular sentence.</p>

Answer 1

您可以在每个标题的 Markdown 中手动执行此操作:

#### [A regular header](#a-regular-header)

A regular sentence.

缺点是维护成本。另一种选择是通过将其添加到所选页面的底部来在客户端创建链接:

<script>
    var headings = document.querySelectorAll("h1[id], h2[id], h3[id], h4[id], h5[id], h6[id]");

    for (var i = 0; i < headings.length; i++) {
        headings[i].innerHTML =
            '<a href="#' + headings[i].id + '">' +
                headings[i].innerText +
            '</a>';
    }
</script>

如果 JavaScript 依赖项不适合您的受众，您可以考虑使用插件、修改后的 Markdown 解析器或任务运行程序(例如 gulp.js)在构建时执行此操作。如果您希望 GitHub Pages 构建您的页面，则无法使用这些替代方案，但您可以在本地构建并提交输出。