Jekyll Highlight Tag:防止转义

Jekyll Highlight Tag: Prevent escaping

{% highlight %}
I want {% raw %}<span class="handle">{% endraw %}this span{% raw %}</span>{% endraw %} to be rendered as HTML.
{% endhighlight %}

是否可以阻止 Jekyll 的 highlight 标签处理输入的某些部分?

在上面的示例中,我希望 Jekyll 像这样生成 HTML:

<pre>
  <code>I want <span class="handle">this span</span> to be rendered in HTML</code>
</pre>

,而不是:

<pre>
  <code>I want &lt;span class="handle" ...</code>
</pre>

突出显示标签有两个参数。第一个参数是您需要突出显示的语言(我假设它是 html),第二个参数称为 linenos,它是一个可选参数,它将强制突出显示的代码包含您需要的行 numbers.So使用 html 得到你想要的。

{% highlight html %}
I want {% raw %}<span class="handle">{% endraw %}this span{% raw %}</span>{% endraw %} to be rendered as HTML.
{% endhighlight %}

换句话说,您不能为此使用 {% highlight %}。回到 HTML,如果它不是太冗长的话。

HTML的冗长可以通过Jekyll的{% include %}.

来解决

Jekyll 强大而灵活。

使用 {% include %} 包含片段可以很好地表达简洁。

包括:

{% assign linenos = "1 2 3" | split: " " %}
{% include linenos.html numbers=linenos %}
{% highlight text %}
Once upon a time, there was a unicorn.

The unicorn looked around.
{% endhighlight %}

包含的片段:

<pre class="linenos"><code>{% for number in include.numbers %}{{ number }}
{% endfor %}</code></pre>

伴随的CSS就是:pre.linenos { float: left; }

结果是 添加行号的能力(通过 {% include %},以您喜欢的样式,不少于此。 上面的“unicorn”例子见here.

您想要的一个更复杂的示例是您可以在其中添加 <span> 元素。抱歉,您需要放弃 {% highlight %} 并自己选择 <pre><code></code></pre>Jekyll 的 {% highlight %} 转义它接收到的所有内容,无一例外。 这个例子是 here

插件也可以工作

但如果您直接发布(没有您自己的 jekyll build 步骤)到 GitHub 页面,则不会。

如果您包含自己的脚本来执行 jekyll build(就像在上述项目中所做的一样),请随意编写您自己的插件!

@{阿都哈迪}

能否将我的答案添加到您的答案中?你是第一个回答正确的人,我要标记你的回答正确。

我的回答...

简答,您不能为此使用 {% highlight %}。如果不是太冗长,请返回 HTML。

HTML的冗长可以通过Jekyll的{% include %}.

来解决

Jekyll 强大而灵活。

使用 {% include %} 包含片段可以很好地表达简洁。

包括:

{% assign linenos = "1 2 3" | split: " " %}
{% include linenos.html numbers=linenos %}
{% highlight text %}
Once upon a time, there was a unicorn.

The unicorn looked around.
{% endhighlight %}

包含的片段:

<pre class="linenos"><code>{% for number in include.numbers %}{{ number }}
{% endfor %}</code></pre>

伴随的CSS就是:pre.linenos { float: left; }

结果是 添加行号的能力(通过 {% include %},以您喜欢的样式,不少于此。 上面的“unicorn”例子见here.

您想要的一个更复杂的示例是您可以在其中添加 <span> 元素。抱歉,您需要放弃 {% highlight %} 并自己选择 <pre><code></code></pre>Jekyll 的 {% highlight %} 转义它接收到的所有内容,无一例外。 这个例子是 here

插件也可以工作

但如果您直接发布(没有您自己的 jekyll build 步骤)到 GitHub 页。

如果您包含自己的脚本来执行 jekyll build(就像在上述项目中所做的那样),请随意编写您自己的插件!