Plugins, Themes

The shortfalls of [shortcodes]

One of the greatest things about WordPress plugins and themes is the ability to add shortcodes to do something fancy to your post content. Introduced in version 2.5, shortcodes are a simple set of functions for creating macro codes for use in post content. The most common of these is of course the gallery shortcode.

It enables plugin developers to create special kinds of content (e.g. forms, content generators) that users can attach to certain pages by adding the corresponding shortcode into the page text.
WordPress Codex on the shortcode API

Having the ability to add code to the post editor was a huge leap for developers looking for ways to implement special features and give the user the ability to harness those features. Perhaps a common example would be to add a slider into your post by using a [slider] shorcode. In this case the user may have created the slider in a Custom Post Type and used the shortcode to generate the slider into their post … pretty simple. WordPress.com also offers a list of available shortcodes and their simple instructions.

BUT, with so much room for adding custom code and scripts to post content comes great abuse as well. I didn’t notice these “shortfalls” until I begin to install certain plugins for some of my clients which utilized shortcodes to a great extent. Many users don’t use shortcodes unless they are extremely simple to use. This isn’t because the user isn’t savvy or unintelligent, it is simply because the process is not intuitive or requires a bit of extra time to go back and forth between the post draft and the shortcodes documentation. Users (business owners, content publishers, etc..) are under time constraints and requiring these complex shortcode formulas further complicate the simple act of publishing content. The greatest thing about WordPress is giving the ability of a user to simply publish content.

A great example would be a hypothetical tab plugin which outputs content in a tab structure similar to the figure below:

Tabs Example

I have seen this many times and I have also seen users get extremely frustrated because the use of [shortcodes] suddenly turns into coding. Here is an example:

[tab name=”Tab One”]
This is the content for Tab One.
[/tab]
[tab name=”Tab Two”]
This is the content for Tab Two.
[/tab]
[tab name=”Tab Three”]
This is the content for Tab Three.
[/tab][/end tabset]

You may have seen this before as well. As a developer or an advanced WordPress user this seems pretty simple as well as intuitive. However, to an average user this could be a bit confusing and I have had many of my clients break this function while not understanding the importance of the closing tag.

An improvement on this method is putting a shortcode button in the text editor much like the plugin WP Easy Columns does in this figure:

Shortcode Button

 

This helps to improve the users actions by inputting the shortcode itself with the click of a button. A popular plugin, WP UI – Tabs, Accordions, Sliders, uses this functionality for tabs. This is an improvement because it inserts the shortcode by providing a separate user interface for entering tab content and outputs something like this: [tabtitle] Tab One [/tabtitle] [tabcontent]This is the content of Tab One.[/tabcontent]

WP UI Shortcode Insert

 

The helpful user interface will have less users breaking the code and is definitely a smarter way to use complex shortcodes. Although, I have still received the “I don’t know what happened” call from clients who have broken well designed shortcodes in their content using shortcode generators.

Shortcodes are an essential feature in WordPress but we have to be mindful of how we program the shortcodes with the user in mind.

Requiring the user to code a little ( open and closing tags ) with shortcodes frustrates many people that use WordPress because of its ease of use.

What do you think?