Ranveer
Ranveer

Reputation: 6863

Jekyll code in jekyll

I'm creating a bird's eye view tutorial for Jekyll, to be hosted on Github pages (on my blog that runs on Jekyll). So, I want to put some code there. If I put the following:

{% for post in site.posts %}
{% if post.categories contains '<categoryname>' %}
    <h2>
      <a href="{{ post.url }}">{{ post.title }}</a>
    </h2>
{% endif %}
{% endfor %}

(all lines after tabspaces), it doesn't render as code, rather, it executes. How do I stop it from executing and render it as code?

Upvotes: 9

Views: 1158

Answers (3)

matt
matt

Reputation: 79723

The {%...%} syntax used by Jekyll is part of the Liquid templating engine. To escape these tags, and so show them literally, you should use the raw tag.

You will probably want to combine this with the markdown syntax for code blocks. With Redcarpet you can use the triple backtick syntax. It doesn’t matter if you put the backticks inside the raw tags or the other way round:

{%raw%}
```
{% for post in site.posts %}
{% if post.categories contains '<categoryname>' %}
    <h2>
      <a href="{{ post.url }}">{{ post.title }}</a>
    </h2>
{% endif %}
{% endfor %}
```
{%endraw%}

Upvotes: 25

R.Brown
R.Brown

Reputation: 31

There are at least three options exist, taht you can use to format code in Jekyll:

  1. highlight - Jekyll has built in
{% highlight java %}
ValidationResult validationResult = NetLicensing.LicenseeService.validate(context, licenseeNumber);
{% endhighlight %}

example: https://raw.githubusercontent.com/Labs64/netlicensing.io/gh-pages/_drafts/2010-09-16-post-template.md (see Syntax highlighting section)

  1. backtick - GitHub style
```java
ValidationResult validationResult = NetLicensing.LicenseeService.validate(context, licenseeNumber);
```
  1. HTML pre/code - HTML can be included in markdown as well

<pre><code> ValidationResult validationResult = NetLicensing.LicenseeService.validate(context, licenseeNumber); <code/></pre>

Upvotes: 0

njk
njk

Reputation: 655

Enclose your code in backticks:

(tested with redcarpet markdown engine)

```
{% for post in site.posts %}
{% if post.categories contains '<categoryname>' %}
    <h2>
      <a href="{{ post.url }}">{{ post.title }}</a>
    </h2>
{% endif %}
{% endfor %}
```

Upvotes: 2

Related Questions