It’s not the newest of news, but self-hosted WordPress now lets you both write and copy-paste Markdown directly into the WordPress block editor (AKA Gutenberg editor), and it will automatically convert the Markdown into WordPress blocks with your formatting.
This added Markdown support has become part of core WordPress, so no special plugin, widget, or block is needed. What a win!
When did this happen? I have no idea, but it’s an awesome perk that isn’t advertised very much, which I think is a shame for all of us Markdown fans. Though, I admit I wasn’t paying too keen attention to the updates in WordPress for some time after the Great Battle of Gutenberg in 2018.
I’ve only recently come round to enjoying the block editor despite its few lingering flaws, and I must say that automatic Markdown support is a nice benefit to using the new editor vs. the classic editor.
On reflection, it highlights that sometimes a drastic technology change is necessary to open new possibilities, despite how difficult it feels to keep up with the pace of progress. Especially with popular software like WordPress, where a dozen of your plugins might have updates every other week.
How to convert Markdown to WordPress blocks
Before, if you wanted to quickly see what your Markdown looked like on your WordPress site, you would either have to write in a text editor like Notepad++ with a Markdown preview plugin, install a Markdown plugin for WordPress, or use a specially designed Markdown editor such as Typora.
Now, however, you can use WordPress as a Markdown editor and preview/publishing tool, because by simply typing or pasting your Markdown text into the block editor on a post or a page, it will automatically convert the Markdown with the appropriate visual formatting (such as headings, subheadings, lists — though not all Markdown tags are supported when typing in real-time, as discussed below). And that happens all before even publishing the post.
I like to write in Markdown because instead of writing HTML such as this:
<p>The first sentence.</p>
<p><a href="https://example.com/link">Here's a link.</a></p>
… you can instead just write this:
The first sentence.
[Here's a link.](https://example.com/link)
… and now WordPress will convert that back to the more cumbersome HTML and present it visually when you paste it into the block editor.
Another reason I like it, of course, is that Markdown has long been supported by Reddit, making it easy to nicely format even the most casual thought or post over on that side of the Web.
Markdown is quicker to type and easier to scan while writing and reading, and over time, these small gains add up. Think of it as getting a lifetime discount on the amount of keystrokes you have to make when writing HTML, while at the same time avoiding all the pitfalls of writing for the Web in something like Microsoft Word.
There are other benefits to writing Markdown in WordPress, too, such as not having to move your mouse to select the heading type (H1/H2/H3/etc.) because you can instead just type the # symbol as many times as you need for the appropriate heading level (e.g. # = H1, ## = H2, ### = H3).
Paste entire Markdown documents
You can also paste an entire Markdown document into the block editor and everything will convert to HTML, while WordPress goes ahead and displays all your formatting in the visual editing mode. Simply copy and paste your Markdown text into the Title field of a new WordPress post and it will populate the empty post instantly.
However, when typing a Markdown-formatted link into a default block instead of pasting it, it doesn’t convert, as the editor assumes that it’s just plain-text.
The same goes for when typing single asterisks for italic text (e.g. *italics*) and double asterisks for bold text (e.g. **bold**); the editor doesn’t interpret these formatting marks as Markdown.
As it stands, it appears that the conversion of Markdown into the WordPress editor when typing (as opposed to pasting) is limited to headings, lists, block quotes, code, horizontal rules, and images, with the above-noted exceptions of italicizing, bolding, linking, and perhaps more.
Want to learn more about how to use Markdown? Check out the simplified Markdown Cheatsheet at MarkdownGuide.org. It’s a neat resource.
Tom Davis is a technical contributor at TechWombat. He enjoys writing on IT, open source, electronics, and other geeky arcana. Tom’s always happy to reply to comments and corrections, so be nice and send him your thoughts at email@example.com or in the comment section below.