android.moparisthebest.org/source/docs/plugins/codeblock/index.markdown
2012-06-03 00:24:03 -05:00

2.9 KiB

layout title date sidebar footer
page Codeblock 2011-07-22 09:13 false false

With this plugin you can write blocks of code directly in your posts and optionally add titles and links.

Syntax

{{ "{% codeblock [lang:language] [title] [url] [link text] [start:#] [mark:#,#-#] [linenos:false]" }} %}
code snippet
{{ "{% endcodeblock" }} %}

Basic options

  • [lang:language] - Choose a language for the syntax highlighter. Passing 'plain' disables highlighting.
  • [title] - Add a figcaption to your code block.
  • [url] - Download or reference link for your code.
  • [link text] - Text for the link, defaults to 'link'.

{% render_partial docs/plugins/_partials/options.markdown %}

Examples

1. Here's an example without setting the language.

{% codeblock %} Awesome code snippet {% endcodeblock %}

The source:

{{ "{% codeblock" }} %}
Awesome code snippet
{{ "{% endcodeblock" }} %}

2. This example uses syntax highlighting.

{% codeblock lang:objc %} [rectangle setX: 10 y: 10 width: 20 height: 20]; {% endcodeblock %}

The source:

{% raw %}{% codeblock lang:objc %}
[rectangle setX: 10 y: 10 width: 20 height: 20];
{% endcodeblock %}{% endraw %}

3. Including a file extension in the title can also trigger highlighting.

{% codeblock Time to be Awesome - awesome.rb %} puts "Awesome!" unless lame {% endcodeblock %}

The source:

{{ "{% codeblock Time to be Awesome - awesome.rb" }} %}
puts "Awesome!" unless lame
{{ "{% endcodeblock" }} %}

4. Add an optional URL for downloading or linking to a source.

{% codeblock Javascript Array Syntax lang:js http://j.mp/pPUUmW MDN Documentation %} var arr1 = new Array(arrayLength); var arr2 = new Array(element0, element1, ..., elementN); {% endcodeblock %}

The source:

{% raw %}{% codeblock Javascript Array Syntax lang:js http://j.mp/pPUUmW MDN Documentation %}
var arr1 = new Array(arrayLength);
var arr2 = new Array(element0, element1, ..., elementN);
{% endcodeblock %}{% endraw %}

5. This example uses a custom starting line number and marks lines 52 and 54 through 55.

{% codeblock lang:coffeescript Coffeescript Tricks start:51 mark:51,54-55 %}

Given an alphabet:

alphabet = 'abcdefghijklmnopqrstuvwxyz'

Iterate over part of the alphabet:

console.log letter for letter in alphabet[4..8] {% endcodeblock %}

The source:

{% raw %}{% codeblock Coffeescript Tricks lang:coffeescript start:51 mark:51,54-55 %}
# Given an alphabet:
alphabet = 'abcdefghijklmnopqrstuvwxyz'

# Iterate over part of the alphabet:
console.log letter for letter in alphabet[4..8]
{% endcodeblock %}{% endraw %}

Other ways to embed code snippets

You might also like to use back tick code blocks, embed code from a file, or embed GitHub gists.