TextformatterCodeBlocks by Teppo

Converts content within backticks into code blocks.

TextformatterCodeBlocks

ProcessWire Textformatter module for enabling Markdown style code blocks for text or RTE fields.

Note: this is not a complete Markdown implementation, but rather a home-baked implementation of just one small part of the Markdown syntax. For full Markdown support, check out the TextformatterMarkdownExtra module, bundled with ProcessWire releases by default.

Getting started


  • Copy (or clone) the TextformatterCodeBlocks directory to /site/modules/
  • Go to Admin > Modules, hit "Refresh", and install TextformatterCodeBlocks
  • Enable "Code Blocks Textformatter" for fields in which you wish to use code blocks

IMPORTANT: if you use Code Blocks Textformatter with a regular text or textarea field, make sure that you enable HTML Entity Encoder or use another method of escaping entities!

Code blocks


Code blocks should work fine when wrapped in <p> or <pre> tags, so you can use them with RTE, such as CKEditor. This module supports two types of code blocks: fenced and inline.

Note: following code examples have been escaped for better readability when rendered in GitHub. In a nutshell the syntax for fenced code blocks is three backticks around a code block, and for inline code blocks just sourround a specific piece of code with single backticks.

Fenced code blocks

Simple example:

```
<?php
echo "This is a fenced code block.";
```

With fenced code blocks you can also specify the language for a syntax highlighter:

```php
<?php
echo "This PHP code is easier for a syntax highlighter to identify.";
```

The end result of fenced code blocks looks like this:

<pre class="code-block code-block--fenced"><code class="language-php">&lt;?php echo "This PHP code is easier for a syntax highlighter to identify.";</code></pre>

Inline code blocks

<p>While fenced code blocks are great for longer code snippets, sometimes `<?php echo "inline code blocks"; ?>` make more sense.</p>

The end result of inline code blocks looks like this:

<p>While fenced code blocks are great for longer code snippets, sometimes <code class="code-block code-block--inline">&lt;?php echo "inline code blocks"; ?&gt;</code> make more sense.</p>

Enabling syntax highlighter


Though syntax highlighting is not necessary for this module to work, it can be really helpful for your end users. You can use any syntax highlighter, but I would recommend Prism.js.

For detailed instructions on enabling Prism.js on your site, please visit http://prismjs.com/.

Install and use modules at your own risk. Always have a site and database backup before installing new modules.

Twitter updates

  • Preliminary 2021 roadmap in progress in this week’s update— More
    8 January 2021
  • Happy New Year! Today I’ve bumped the version on the dev branch to 3.0.170, and it’s quite a lot of updates. This post covers most of them. In this post, there’s also a question for you: what would you like to see in ProcessWire in 2021? More
    1 January 2021
  • In this week’s blog post we’ll take a brief look at a powerful new ProFields module for ProcessWire that’s just around the corner—the Combo field: More
    4 December 2020

Newest forum posts

Latest news

  • ProcessWire Weekly #349
    In the 349th issue of ProcessWire Weekly we're going to cover the latest core and forum updates, introduce some recent ProcessWire resources, and more. Read on!
    Weekly.pw / 16 January 2021
  • ProcessWire 3.0.170 core updates
    Happy New Year! Today I’ve bumped the version on the dev branch to 3.0.170, and it’s quite a lot of updates. This post covers most of them. In this post, there’s also a question for you: what would you like to see in ProcessWire in 2021?
    Blog / 1 January 2021
  • Subscribe to weekly ProcessWire news

I just love the easy and intuitive ProcessWire API. ProcessWire rocks!” —Jens Martsch, Web developer