如何使用带有 markdown 的 jekyll 创建侧边菜单答案

【问题标题】：How to create a side menu by using jekyll with markdown如何使用带有 markdown 的 jekyll 创建侧边菜单
【发布时间】：2019-03-24 00:12:13
【问题描述】：

我有一个准备好的降价文件想在 html 上显示。了解 jekyll 已经完成了这项工作，但我想要一个浮动侧菜单，但我找不到 jekyll 的任何文档。有人可以帮忙吗？

【问题讨论】：

标签： markdown jekyll github-pages

【解决方案1】：

使用Leap day theme会为当前页面的table of contents生成一个浮动菜单。

您可以preview the theme to see what it looks like

这是github页面之一Supported themes

【讨论】：

【解决方案2】：

如果你想要 Markdown 中的目录，你可以使用this answer。如果你想创建一个菜单，你可以包含这个内容：

<ul>
  <li {% if page.url contains '/getting-started' %}class="active"{% endif %}><a href="/getting-started/">Getting started</a></li>
  <li {% if page.url contains '/without-plugin' %}class="active"{% endif %}><a href="/without-plugins/">Without plugins</a></li>
  <li {% if page.url contains '/about' %}class="active"{% endif %}><a href="/about/">About</a></li>
  <li {% if page.url contains '/blog' %}class="active"{% endif %}><a href="/blog/">Blog</a></li>
</ul>

在布局文件中使用包含，如下所示：

{% include simple-menu.html %}

来源：https://jekyllcodex.org/without-plugin/simple-menu

请注意，无法在纯 Markdown 中创建浮动菜单。这就是为什么您没有收到任何“真实”答案的原因。但是，Markdown 确实支持 HTML，Github Pages 有自动的TOC's。但是将 HTML 添加到您的 Markdown 文件是一个丑陋的 hack，您可能没有使用 Github Pages/redcarpet。

【讨论】：