Shortcodes: Should They Be Done Differently?

wordpress-shortcodes-best-option-for-stylized-contentShortcodes were introduced in WordPress near the beginning of 2008, and ever since then blogging has never been the same (well, sort of). From dedicated plugins to built–in generators for themes, they have become ubiquitous with WordPress.

But, is that a good thing?

Most themes and plugins offer some sort of input mechanism to enter custom shortcodes to display content, it is then stylized with CSS and/or jQuery effects like tabbing, slides etc…

More often than not, your shortcode will look like this, in the most simplest of examples as provided by the default WordPress gallery function -

[gallery]

That, I can live with. However, take a look at this -

[sws_ui_tabs ui_theme="eggplant" size="50"][tabs_panel title="Test"]Test content [/tabs_panel] [tabs_panel title="Test 2"]Test content 2 [/tabs_panel] [tabs_panel title="Test 3"]Test content 3 [/tabs_panel] [/sws_ui_tabs]

The above code is produced from a popular premium shortcode plugin available on CodeCanyon.

I can see the benefit of using it once the content is published, as it does give a nice tabbed interface in the Post. But is it too much for an average user to “learn” in order to get some snazzy looking tabs? The potential to mess up a single bracket or quotation mark is high and will only give rise to unnecessary support requests, because 8/10 times…who reads instructions!

Featured Plugin - WordPress Google Maps Plugin

Simply insert google maps into posts, sidebars and pages - show directions, streetview, provide image overlays and do it all from a simple button and comprehensive widget.
Find out more

Wasn’t the point of WordPress to simplify blogging and content management? This seems like a step back and confuses the new, light and the “just don’t have time to learn this stuff” type of user.

Even though most of the time you WILL find helpful shortcode generators within plugins and themes, the same cannot be said to edit and maintain the content. Imagine having more than one shortcode like that per Post!

It may seem fine to seasoned WordPress users, but try showing that to a person who just got into blogging, chances are they’ll stay without it.

Should They Be Done Differently?

My question to you is, should shortcode insertion (and the back-end presentation itself) be done differently. If so, how?

I would think they could be done via a separate meta box or even a separate “Shortcode” tab next to the Visual and HTML one.

Tell us what you think!

Tags ,

Comments (14)

  1. I agree with the Shortcode tab feature in WP. The shortcodes themselves can be really useful, but the process of creating a specific shortcode each time can get really tricky and prone to error. If all shortcodes had a “builder” in the admin, this would make it much easier.

  2. Cart66 has one of the best setups for shortcode insertion I’ve encountered. It includes a tab at the top of the editor which, when clicked, offers a list of all of their shortcodes. When one is selected a form is displayed allowing you to input and/or select appropriate options. Yes, once inserted into the page it’s about as messy as the example given above but putting it there in the first place is about as easy as it gets. If you need to use shortcodes building them parametrically within the backend is a good way to go IMHO.

  3. Short codes can be daunting depending on the complexity of the particular code. Most are pretty simple. Even with a builder in the admin… what happens if you need to change something? At what point does it just become something a user has to learn? Anyone working in WordPress and using shortcodes should know at least some basic HTML or at least be able to understand what is going on between visual and HTML mode. They need to know how to edit this stuff even if it is in a short code. When writers had to learn a PC vs. a typewriter.. there was learning to do. Short codes are about as simple as it gets for web code… IMHO If you want to use them.. learn how they work so you can be proficient and not just a blind user.

    Your comment about showing shortcodes to a new blogger… well.. shortcodes may not be for new bloggers. They are an advanced technique. Until the new blogger becomes comfortable with everything else they need to know just to post a simple blog.. they have no need of shortcodes. It is also an incentive for them to become more proficient. IMHO :)

    • John, I agree shortcodes are not for new bloggers. But then again most of the themes being sold today, even the free ones, come with them, and they are offered as “features”. So when a user gets the theme, they find out they need to sit down and learn a whole new thing. I’m not saying it’s not bad either for them to learn, I just think that there should be a better way to implement them.

      As for them needing to know basic HTML in order to blog, well I don’t think a blogging system should require that. WordPress out of the box certainly doesn’t need anyone to know what HTML is in order to get started, or anywhere down the line.

  4. It absolutely should be in another tab next to Visual and HTML. And I think it’s best to try and eliminate any guesswork for the blogger and place that load on the programmers (I’m a programmer, BTW). I think it’s up to us to enhance the user experience in the best way possible while trying to keep the learning curve to a minimum. I think if it’s done correctly, you don’t need to sacrifice functionality while still enabling the user to customize whatever feature you’re adding (buttons, tabs, tables, etc.).

    I’ve never tried Cart66, but I keep hearing A LOT about it lately and people are saying all good things. I should definitely check it out…

  5. Yes, bloated shortcode syntax is far from user friendly – but I don’t think we need to change how they’re implemented. There’s nothing wrong with the standard use cases, like embedding an image gallery or video.

    We only run into issues with plugins and themes that take shortcodes too far, and turn them into pseudo-markup. These are the exceptions, though. Changing how shortcodes work because certain developers have abused them would be overkill.

    If themes and plugins are causing the problem, we should educate developers on how to implement shortcodes in a user-friendly way. Some methods have already been mentioned above. :)

    • Chris, that’s exactly it. Real world, non-technical users expect toolbar buttons as that’s what they get in other applications. Making functionality like this as standard in WordPress would make a big difference to users. I think many WordPress experts forget that shortcodes are intimidating to regular users, they’re just not comfortable with codes of any kind – excluding emoticons interestingly…

  6. Take a look at my plugin Shortcodes UI which adds an admin UI for creating shortcodes without the need to code, edit code, or even know code.

    With it you can create a nested shortcode for your tabs for example and then in your post just call that tabs shortcode you created.

    its hard to explain what i mean but easy to understand how to do it. :)

  7. Tabs do seem like the most complicated sort of shortcode that a non-technical user would want to use most often… How hard would it be to create a way to visually edit tab content? Would you need to create a custom post type for tabs and then insert them into posts with shortcode? example: [tab title="sales"] to pull in a sales tabbed content.

  8. Big fan of shortcode builders, shortcodes-ultimate and other plugins do a great job of keeping up user friendliness. On the subject of tabs, I recently made some functions for a client that use tab shortcodes inside of a custom loop to create a complicated tabbed area out of post info (using the title for the tab title, and displaying a full post single in the content area), then tied it together with a shortcode helper (basically a query builder) to output a single shortcode that does all the heavy lifting. I don’t know if this is a good thing or a bad thing, but I’m curious about shorcode-ception and creating advanced compositions and distilling them into simple shortcode elements.

Participate