code blocks

Getting nice preformatted code on your site, perhaps with syntax highlighting and line numbers

The simplest thing (this always works)

If you put code inside a block starting and ending with ```, it will render as code:

You write:

```
# This is Python code
print ("Hello, World")
```

You get:

# This is Python code
print ("Hello, World")

Syntax Highlighting

If you have things set up properly, you can get fancier, with syntax highlighting for specific languages, line numbers, and so forth.

You write:

```python
# This is Python code
print ("Hello, World")
```

A list of supported languages appears here: https://github.com/jneen/rouge/wiki/List-of-supported-languages-and-lexers

You get:

# This is Python code
print ("Hello, World")

A list of supported languages is here: https://github.com/jneen/rouge/wiki/List-of-supported-languages-and-lexers

Syntax Highlighting with Line Numbers

{% highlight python linenos %}
def hello():
   print ("Hello, World!")
{% endhighlight %}

Gives:

1
2
def hello():
   print ("Hello, World!")

Troubleshooting the colors and highlighting

If syntax highlighting with colors is not working, make sure that:

What if my code block contains stuff that is meaningful to liquid syntax?

If you have characters such as {{ this }} that would normally be meaningful to liquid syntax, and therefore are not showing up properly inside code blocks, you can use these special markers to indicate that liquid should NOT do any processing of that input:

For example, to get:

In Handlebars, {{ this }} will be HTML-escaped, but
{{{ that }}} will not.

Use:

```
In Handlebars, {% raw %}{{ this }}{% endraw %} will be HTML-escaped, but
{% raw %}{{{ that }}}{% endraw %}  will not.
```

If you are trying to reproduce {% raw %} and {% endraw %} themselves inside a code block, see the markdown source for this page.

See also