WordPress makes it easy and intuitive enough for you to write your content directly into the visual editor while styling your text, but it’s not necessarily a quick process.
Anyone who has any experience composing content in the editor knows that you have to continuously reach for your mouse or trackpad so you can highlight the text you want to style and click the buttons at the top of the visual/text editor (either that or learn often unintuitive keyboard shortcuts). It’s fine for users who aren’t in a rush and prefer the straightforwardness of the editor, but there’s another way of getting it done faster.
Markdown is a lightweight and intuitive markup language that provides a faster way to style your posts, pages and comments. Although it takes a little time getting used to, you’ll never have to reach for your mouse while using Markdown.
In this article, we’ll go over what Markdown is all about and how you can start using it with WordPress.
A Brief Background of Markdown
In an effort to come up with a solution to easily write and format text on the web, John Gruber and Aaron Swartz created Markdown in 2004. It relies only on plain text and doesn’t require users to learn any complicated code or shortcuts, meaning that even WordPress beginners can learn how to use it on their own.
When you use Markdown on your WordPress site, which we’ll cover later in this article, you’ll be able to type specific characters around the text you want to style. For example, to italicize some text, all you need to is add an asterisk character on both ends. The *italicized text* will show in actual italicized text format when published on your site. Like freakin’ magic.
Once you’re familiar with Markdown, you’ll be able to cut down on the time you spend formatting your WordPress content. The hardest part is really just memorizing the characters to implement each style, which becomes second nature with enough practice.
Another great point to make about using Markdown with WordPress is that all the text you create with it will remain in Markdown format. So even though your content is published as fully formatted on your site, you’ll be able to go back and edit in Markdown anytime you want.
If you’re interested in exploring some of the different tools available for using Markdown, you may want to check out Mou, a free Markdown editor for Mac, or MarkPad, an open source Markdown editor for Windows. Texts is another that works for both Mac and Windows, with the ability to convert Markdown to other popular file formats like PDF and MS Word.
For mobile device use, you can take advantage of Byword, which is a Markdown editor for the iPhone and iPad (it also works on Mac).
Now let’s dive deeper into how Markdown can be used with WordPress. We’ll start by covering the Markdown-inspired enhancements to the editor that were introduced in WordPress 4.3.
WordPress Editor Enhancements in Version 4.3
In the WordPress 4.3 release, inline text shortcuts similar to Markdown were introduced, allowing you to format text and add elements using simple markup in the text. However, unlike Markdown these text patterns immediately transform patterns into HTML.
The current enhancements include:
- Typing an asterisk (*) or a dash (-) to generate a bulleted list
- Typing 1. or 1) to generate an ordered list
- Starting a paragraph with 2 to 6 number symbols (#) to generate different headings
- Typing the greater-than symbol (>) to generate a blockquote
You can see a short demo video of these shortcuts in action here.
More shortcuts are planned for future releases, along with support for plugins to extend existing functionality.
Using Markdown With WordPress
The best way to learn Markdown is to actually start using it yourself. So rather than listing out all the different shortcuts, which you can access from the WordPress quick reference page anyway, here’s a basic example:
This Markdown text creates the same formatting as the HTML does below. It’s pretty clear to see how much simpler Markdown keeps it by looking at this comparison.
As you can see pretty easily, adding ## to some text is the same as wrapping it with <h2> tags. Likewise, adding * is the same as using <em> tags while adding ** is the same as using <strong> tags.
Here’s what it looks like when it’s published:
If you start typing these Markdown shortcuts directly into WordPress right now, you might see some of them work automatically when you use them and hit Enter to start a new paragraph because of the editor enhancements that were introduced with WordPress version 4.3, but you won’t see all of them. To take full advantage of Markdown, you’ll have to install a plugin.
There are at least three good plugins you can use to integrate Markdown with WordPress.
Jetpack bundles together a wide range of powerful features that WordPress users can take advantage of to customize their sites. Markdown support is also included. In fact, Jetpack uses Markdown Extra, which is an extension to Markdown that brings some additional features to the syntax. You can learn more about Markdown Extra here.
In your WordPress admin area, navigate to Jetpack > Settings and scroll down the list until you see Markdown, then activate it and your set!
Now you can compose or edit any posts, pages, or comments using Markdown. Just make sure you use the text editor rather than the visual editor, as Jetpack specifies on its Markdown support page.
If you don’t plan on using any of the other features that come with the Jetpack plugin and would prefer just a simple standalone Markdown plugin, you should consider using PrettyPress. Not only does it offer Markdown support but it also provides users with a sleek, easy to use publishing interface that comes with a live preview layout.
Installing this plugin will add a PrettyPress tab to the top of the sidebar area when you edit posts or pages. Click Launch PrettyPress to use it, which brings up a simple Markdown editor on the left and layout preview on the right in fullscreen view.
Anything you type or edit in the editor can be seen in real time within the preview. This can be a huge plus for new users who are still learning Markdown, which saves time between previewing or publishing the changes in a separate browser tab or window.
You can also conveniently switch between the views for Markdown, Visual, and HTML directly in the PrettyPress editor. Just click the x in the top left corner when you want to go back to the WordPress editor.
Despite it being a popular choice, you may want to consider using one of the two alternative plugins above first since WP-Markdown hasn’t been updated in two years. Just keep that in mind when considering this one.
If you do go ahead and decide to try WP-Markdown, you can navigate to Settings > Writing in your WordPress admin area where you’ll find your new Markdown settings. From here, you can enable Markdown for posts, pages, or comments and even install the optional help bar, which adds a convenient preview feature so you can see your changes as they’d appear live on your site.
Another big point worth mentioning here is that when you enable Markdown through this plugin, it will completely disable the visual editor on every post type where it’s enabled. All old posts and pages will also be converted. If you choose to deactivate the plugin, however, it will not alter your posts, pages, or comments where you originally had it enabled since it stores all the processed HTML.
Making the Most of Markdown
Markdown may seem intimidating to the WordPress user who has no real experience with code, but in reality, anyone who can type on a keyboard can easily learn how to use it.
It may be slow at first in terms of having to go back and check to see what you need to use for certain formatting shortcuts, but once you’ve used them enough, you’ll be able to type them out automatically right off the top of your head and save a great deal of time on publishing and editing your content.
With the Markdown-inspired editor enhancements in WordPress version 4.3 and more to come, users may soon not even need to turn to plugins to use everything that can be done with Markdown.
Why 100 is NOT a Perfect Google PageSpeed Score (*5 Min Watch)
Learn how to use Google PageSpeed Insights to set realistic goals, improve site speed, and why aiming for a perfect 100 is the WRONG goal.