Presto! The Magic of Shortcodes

Abracadabra! Hocus Pocus! Expecto Patronum (we know you’re out there, Potterheads)! As kids we all loved the idea that shouting a weird-sounding word while flicking a wand could make cool things happen (bunnies! pigeons! a person cut into two!).

Today, let’s dabble in some less-known blogging magic. Replace the exotic word with a bit of code, trade the wand for brackets, and presto: shortcodes!

Popular Trick by Pasukaru76 (CC BY 2.0)

Eye of newt and toe of frog? You don’t need those in your blog!

Shortcodes are extremely useful shortcuts that can produce all kinds of blogging wizardry, from adding objects and files to your posts, to organizing and customizing your content. Before diving into some potent, dark magic, though, it’s important to remember two key ingredients to this potion:

1. Shortcodes are always enclosed in [square brackets].
2. While most shortcodes can be entered in both the Text Editor and Visual Editor, some might require the Text Editor. Don’t be alarmed, though! It’s straightforward to use, and you’ll feel very accomplished once you’ve dropped a couple of shortcodes in your blog.

Double, double, toil, and trouble? Nah, a shortcode’s easier.

So what can you do with shortcodes? The list is long and varied, from embedding various types of video players  to creating customized archive pages and even in-blog slideshow presentations. Here are some real-life cases in which shortcodes will magically execute an otherwise complicated process — in a snap.

Map it!

Say you just gorged on some yummy ice cream in your favorite Philly gelateria. You’ve uploaded a photo of the deed, but you also want to let your readers know where they should go if they want to follow in your footsteps. Enter the Google Maps Shortcode.

All you’d need to do is find the desired street address on Google Maps, click on the link icon, and copy the html code it generates.

Paste the code in its own line in your Text Editor, and click Save Draft (or Update, if your post is already pubished). Clap your hands twice (or don’t) and… that’s it: the map is there (you’ll see that magic has taken place since the braces — the angular brackets < > — have morphed into square brackets).

In this case, the resulting shortcode produces this map:

Gather ’round!

Suppose your blog contains dozens of movie reviews, scattered among all the other posts you’ve published over the last couple of years. Wouldn’t it be neat to have a page where a movie-loving visitor could find all your musings on the French New Wave (or Shrek)? But wouldn’t it be annoying to aggregate these posts manually, one by one? The Display Posts Shortcode ensures that you don’t have to do that.

A highly versatile shortcode, it lets you group together posts based on many different criteria. If you’ve been tagging all your movie reviews with ‘Film,’ all you’d need to do to bring all these posts to the new page is type in the following code:

[display-posts tag="film"]

Or, if you’re up for some headier sorcery, go a couple of steps further:

[display-posts tag="film" posts_per_page="15" include_excerpt="true" order="ASC"]

This shortcode will result in the neat list you see on the left side. It shows all your tagged film reviews (up to fifteen per page) in chronological order from the oldest to the newest, along with an excerpt of each post (a comprehensive list of available arguments — the bits you add to the shortcode to make it do what you want — is available on the related support page).

Mago//Magician, by Eva Peris (CC BY-SA 2.0)

Subscribe ‘em!

Most bloggers want to make it easy for their visitors to subscribe to their blog to receive new posts by email. Some of you, though, don’t want to rely on a sidebar for a Subscribe button — for example, if you’re using a clean, one-column theme, or if you wish to avoid widgets on your static pages. What can you do? Put on the top hat and use the Blog Subscription Shortcode! (Or just lose the hat. Seriously.)

You don’t need to be a Hermione to master this one: simply drop the following shortcode wherever you want the Subscribe form to appear:

[blog_subscription_form]

Depending on whether your visitor is a logged-in WordPress.com user or not, the form will take one of the  two shapes on the right.

Wands out!

The shortcodes we covered here are but the tip of the iceberg. Once you get into the habit of dropping these bracketed magic phrases into your blog, there’s so much you can do: from customizing  your image galleries to embedding an Excel spreadsheet.

Have you already tried shortcodes? If yes, which ones have you found the most useful? If not, give a simple one a try: try embedding a Google Map, or creating a Subscribe form on your blog!