jekyll - Kramdown 目录不显示在 HTML block 内

标签 jekyll github-pages kramdown

我正在关注这个question ,但对我来说似乎没有效果。任何帮助将不胜感激。

_includes/layout.html

<main>
<div>
<!-- Sidebar -->
<aside markdown="1">
<h4>Table of Contents</h4>
* ToC
{:toc}
</aside>
<!-- END Sidebar -->

<!-- Main content -->
<article>
{{ content }}
</article>
<!-- END Main content -->
</div>
</main>

_config.yml

markdown: kramdown

结果:

enter image description here

更新

_layouts/site.html

<aside markdown="1">
mark**down**
</aside>

它只是按照上面的方式呈现。 Kramdown 在配置中已打开。

最佳答案

通过使用 pure liquid ToC by allejo 解决.

% capture tocWorkspace %}
{% comment %}
    "...like all things liquid - where there's a will, and ~36 hours to spare, there's usually a/some way" ~jaybe

    Usage:
        {% include toc_pure_liquid.html html=content sanitize=true class="inline_toc" id="my_toc" h_min=2 h_max=3  %}

    Parameters:
        * html     (string) - the HTML of compiled markdown generated by kramdown in Jekyll

    Optional Parameters:
        * sanitize (bool)   : false  - when set to true, the headers will be stripped of any HTML in the TOC
        * class    (string) :   ''   - a CSS class assigned to the TOC
        * id       (string) :   ''   - an ID to assigned to the TOC
        * h_min    (int)    :   1    - the minimum TOC header level to use; any header lower than this value will be ignored
        * h_max    (int)    :   6    - the maximum TOC header level to use; any header greater than this value will be ignored

    Output:
        An unordered list representing the table of contents of a markdown block. This snippet will only generate the table of contents and will NOT output the markdown given to it
{% endcomment %}

{% capture my_toc %}{% endcapture %}
{% assign minHeader = include.h_min | default: 1 %}
{% assign maxHeader = include.h_max | default: 6 %}
{% assign nodes = include.html | split: '<h' %}
{% for node in nodes %}
    {% if node == "" %}
        {% continue %}
    {% endif %}
    {% assign headerLevel = node | replace: '"', '' | slice: 0, 1 %}
    {% assign headerLevel = headerLevel | times: 1 %}
    {% assign indentAmount = headerLevel | minus: minHeader | add: 1 %}
    {% assign _workspace = node | split: '</h' %}
    {% unless headerLevel >= minHeader %}
        {% continue %}
    {% endunless %}
    {% if headerLevel > maxHeader %}
        {% continue %}
    {% endif %}
    {% assign _idWorkspace = _workspace[0] | split: '"' %}
    {% assign html_id = _idWorkspace[1] %}
    {% capture _hAttrToStrip %}{{ headerLevel }} id="{{ html_id }}">{% endcapture %}
    {% assign header = _workspace[0] | replace: _hAttrToStrip, '' %}
    {% assign space = '' %}
    {% for i in (1..indentAmount) %}
        {% assign space = space | prepend: '  ' %}
    {% endfor %}
    {% capture my_toc %}{{ my_toc }}
{{ space }}- [{% if include.sanitize %}{{ header | strip_html }}{% else %}{{ header }}{% endif %}](#{{ html_id }}){% endcapture %}
    {% endfor %}
    {% if include.class %}
        {% capture my_toc %}{:.{{ include.class }}}
{{ my_toc | lstrip }}{% endcapture %}
    {% endif %}
    {% if include.id %}
        {% capture my_toc %}{: #{{ include.id }}}
{{ my_toc | lstrip }}{% endcapture %}
    {% endif %}
{% endcapture %}{% assign tocWorkspace = '' %}
{{ my_toc | markdownify }}

关于jekyll - Kramdown 目录不显示在 HTML block 内,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43903130/

相关文章:

.htaccess - 在AngularJS网站上获取404页面以进行刷新?

css - GH 页面看不到我的图像的路径

javascript - 在自定义域上部署 React App 时出现 404 错误

html - Jekyll & KramDown - 如何显示表格边框

jekyll - 自定义jekyll/kramdown网站上自动生成的目录

jekyll - 使用Jekyll检查文件是否存在

github 页面上的 Jekyll 博客不显示我的新帖子,但它可以在 localhost :4000 上运行

css - 不熟悉 Sass,我认为我的 main.scss 中有一个小语法问题阻止我编译

ruby - 使用 Jekyll 的 Tumblr.rb 将 Tumblr 博客迁移到 Octopress 时获取 'CGI (LoadError)'

markdown - 将类添加到 Kramdown 中的表行