{% highlight %}
I want {% raw %}<span class="handle">{% endraw %}this span{% raw %}</span>{% endraw %} to be rendered as HTML.
{% endhighlight %}
Is it possible to prevent Jekyll's highlight
tag from processing some parts of the input?
In the above example, I would like Jekyll to produce HTML like this:
<pre>
<code>I want <span class="handle">this span</span> to be rendered in HTML</code>
</pre>
, rather than:
<pre>
<code>I want <span class="handle" ...</code>
</pre>
Highlight tag take two argument. First argument is the language you need to highlight(I assume it html) and second argument is called linenos
that is an optional which will enforce the highlighted code to include line numbers.So you need to use html to get what you want.
{% highlight html %}
I want {% raw %}<span class="handle">{% endraw %}this span{% raw %}</span>{% endraw %} to be rendered as HTML.
{% endhighlight %}
In other words, you can't use {% highlight %}
for that. Fall back on HTML, if it isn't too verbose.
HTML's verbosity can be solved by Jekyll's {% include %}
.
Using {% include %}
to include snippets can lend well to concise expressions.
The 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 %}
The included snippet:
<pre class="linenos"><code>{% for number in include.numbers %}{{ number }}
{% endfor %}</code></pre>
And the accompanying CSS is simply: pre.linenos { float: left; }
The result is the ability to add line numbers (via {% include %}
), in your preferred style, no less.
The above "unicorn" example is seen here.
A more involved example you would want is where you can add <span>
elements inside. You need to ditch {% highlight %}
and go with <pre><code></code></pre>
yourself, sorry. Jekyll's {% highlight %}
escapes all content it receives, no exception. That example is here.
But not if you're publishing directly (no jekyll build
step of your own) to GitHub Pages.
If you include your own scripts to do jekyll build
(like what is done in above-mentioned project), feel free to write your own plugins!