WordPress allows you to highlight blocks of code for readability when writing a post or typing a comment. This can easily be acheived by adding text between <code></code> tags at which point it will put it in a pretty little box and differentiate it from the rest of the content. If you’re reading this however you probably already knew that.

The problem I faced however was, if I added one or more blank lines within these <code></code> tags it would completely split up what was before the new line and what was after. Allow me to show you an example of what I mean:

This is a line of text with a blank line after it.

This is the second line of text with a blank line before it.

See how it looks like two separate code snippets?

The Solution

The solution turned out to relatively simple. All that was needed was to add a &nbsp; (non-breaking space) character or <br /> tag on the blank line and it would keep the code block complete around all lines.

I’ve include below an example where I place a <br /> tag on the blank line in the middle:

This is a line of text with a blank line after it.

This is the second line of text with a blank line before it.