首页
学习
活动
专区
圈层
工具
发布
社区首页 >专栏 >Jekyll x kramdown TOC 目录生成

Jekyll x kramdown TOC 目录生成

作者头像
szhshp
发布2022-09-21 09:49:02
发布2022-09-21 09:49:02
4990
举报

配置

首先需要对 _Config.yml 进行配置

代码语言:javascript
复制
markdown: kramdown
toc_levels: 1……2

第二个参数是决定 h1 到 h2 的标题都会自动生成, 可以根据需要自己改

使用

然后在需要添加目录的文章里面添加以下文字

  • any list {:toc}

Extra

可以对 TOC 列表进行一定的美化, 使用最简单的 CSS 即可

代码语言:javascript
复制
    #markdown:before {
        content: "目录";
        font-weight: bold;
    }
    ul#markdown-toc {
        list-style: none;
        position: fixed;
        padding: 0px;
        left: 10px;
        bottom: 200px;
        border-radius: 0.3em;
        box-shadow: rgba(0,0,0,0.15) 0 1px 4px;
        box-sizing: border-box;
        border: #fff 0.5em solid;
        background-color: white;
    }

Better solution for Responsive TOC

Link: awesome-toc

参考文献

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2015-11-18,如有侵权请联系 cloudcommunity@tencent.com 删除
目录
  • 配置
  • 使用
  • Extra
  • Better solution for Responsive TOC
  • 参考文献
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档