WordPress code shortcodes plugin

WordPress code shortcodes plugin

WordPress code shortcodes for using code snippets. *Always* without smart quotes and with html entities.

For the code snippets on this website I decided not to have a syntax highlighter. But I ran into 2 problems when using <pre><code> and <code>:

  • WordPress sometimes transforms quotes to "smart quotes". Sure, this should not happen with text in between <code> and <pre>. But sometimes it does.
  • This is an obvious one, but the code snippets need to be transformed to html entities.

I solved this by creating 2 simple shortcodes:

  • [precode] for <pre><code>
  • [code] for <code>.

Convert to html entities

To convert to html entities, I used:

htmlentities( $content, ENT_NOQUOTES, "UTF-8", false );

Disable smart quotes in shortcodes

And there's a nice little filter to disable smart quotes in shortcodes:

function my_no_texturized_shortcodes_filter( $shortcodes ) {
    $shortcodes[] = 'code';
    $shortcodes[] = 'precode';
return $shortcodes;
}
add_filter( 'no_texturize_shortcodes', 'my_no_texturized_shortcodes_filter' );

Short code shortcodes plugin

I put these shortcodes in a plugin, childishly named: Short code shortcodes. (Sorry, couldn't help myself.)

If the plugin is installed, you use the shortcodes like this:

[code]For in-line code, use it in the same way as you'd use <code>.[/code]

[precode]
This is the "precode" shortcode, for block-level code.
Use it in the same way as you'd use <pre><code>.
[/precode]

You can pass all HTML core attributes to the shortcode and they will get rendered in the outputted html.

[code class="myclass" dir="rtl"] Is totally fine,
and will be rendered as <code class="myclass" dir="rtl">

Anyway, to download the plugin, head on over to Github.

Update: Added buttons for the shortcodes to TinyMCE's kitchensink and to the quick tags.