How to Use the Prettify WordPress Plugin

To use the Prettify plugin, place your code within a <pre> text block, and then specify the class of the block as “prettyprint”.  To do this, switch to Text mode within the WordPress editor.

<pre class="prettyprint">
// your code here
</pre>

For more information on this plugin, see the Prettify Code Syntax page. You can select from several different pre-defined styles in the plugin settings.  Additionally, you can also look at the Google Code Prettify page for details on how to customize the appearance of the code block.

Optionally, you can also specify the programming language with an embedded <code> tag.  However, I have not found that doing so makes any difference to the final appearance. Nonetheless, the plugin does a decent job of applying a generic syntax highlighting, which makes code blocks more readable.

<pre class="prettyprint">
<code class="language-java">
// your code here
</code>
</pre>

Here are some examples:

#!/bin/bash

function log() { 
    msg="$1" 
    echo "$msg"
} 

log "some important event"

x="true"
if [ "$x" = "true" ]; then
   echo "it's true"
fi
#!/usr/bin/env python

def some_function():
    return 1

a = some_function()
print a

for b in range(10):
    print b

c = [ 'foo', 'bar', 'baz' ]
for e in c:
    print e

If you’re not seeing blank lines within your code blocks, where you expect them to be, edit the code block in the editor’s Text mode.

Note, without the class, the text within the block will display as normal un-highlighted text.

<pre>
// appears as normal text, without syntax highlighting
</pre>

For example:

// appears as normal text, without syntax highlighting

Leave a Reply

Your email address will not be published. Required fields are marked *