Getting The Most Out Of WordPress Shortcodes

Last Updated on September 20, 2022 by 16 Comments

Getting The Most Out Of WordPress Shortcodes
Blog / Tips & Tricks / Getting The Most Out Of WordPress Shortcodes
Play Button

Chances are that if youโ€™ve been using WordPress for a while then youโ€™ve heard of something called a shortcode. Ok, that might be an understatement. If youโ€™ve been using WordPress for a month then chances are youโ€™ve already been using shortcodes left and right.

Itโ€™s become common practice for shortcodes to be included as major selling points in themes on sites like Envato (among others). Any time a plugin does something requiring a complex function, they tend to offer a shortcode that drastically simplifies the process. So like I said, youโ€™re undoubtedly familiar with them.

However, just because you may be familiar with the shortcode use cases youโ€™ve come across so far, that doesnโ€™t mean youโ€™ve learned how to unlock their full potential. Furthermore, because of their ease of use they are sometimes deployed in ways that are not ideal for users over the long term.

In order to help all of the Elegant Themesโ€™ readers get the absolute most out of WordPress shortcodes, Iโ€™ve decided to take us back to the basics (briefly), discuss why theme specific shortcodes can be problematic, and finally provide you with a short list of the very best WordPress Shortcode Plugins around.

To begin, we need to ask the most obvious question.

What are WordPress Shortcodes?

Simply put, a shortcode is a bracketed tag that allows WordPress users to easily deploy predefined functionality into any shortcode enabled area of their site. Such as posts, pages, widgets, and hooks.

For example, a basic shortcode for a gallery looks like this:

[gallery]

The Five Standard WordPress Shortcodes

What many users may not know is that WordPress actually come with the ability to execute five shortcodes right out of the box:

Iโ€™ve linked each of the shortcodes above to their corresponding pages in the WordPress Codex. For those interested, those pages will help you get the most out of the five standard shortcodes WordPress offers. These pages are a great resource for beginners and even seasoned users may find or rediscover some useful best practices.

Shortcode Plugins vs. Theme Specific Shortcodes

Now itโ€™s time to tackle what is probably the biggest misconception about shortcodes in general. Regardless of what a theme author may say in his or her promotional text, shortcodes should not be tied to a specific theme. Shortcodes should come as part of a separate plugin so that regardless of the theme you are using your shortcode functionality will not break.

This is something that all decent theme authors understand. However, I continue to see this practice all over the place. Theme authors using shortcodes that only work with their theme as a major selling point. Often luring in customersย who do not know better. Because they are ignorant of how themes and plugins work, they do not understand that a year or so down the road when they want to change their theme, they canโ€™t. Why? Because they built their business on functionality that cannot be ported from one theme to another. Thatโ€™s why the best vehicle for custom short codes is via a separate plugin, either by the theme author themselves or a third party.

With that said, letโ€™s take a look at some of the best shortcode bundle plugins available today.

The Best Shortcode Bundle Plugins Around

When you search for shortcode plugins youโ€™re bound to find a massive amount that use them. But the ones Iโ€™ve chosen to focus on for this post are those plugins that provide shortcode bundles. A lot of plugins willย use a shortcode to execute their primary function or one feature they offer, but these plugins provide a large number of useful shorcodes (sometimes 100+) with their own useful functions. And of courseย theyโ€™re all designed to work with any theme.

Shortcodes by Elegant Themes

Elegant-Themes-Shortcodes

While perhaps not as comprehensive or powerful as some of the other plugins on this list, it may be the natural choice for many reading this post. As no doubt the majority of you are already Elegant Theme Members and as such, get this plugin for free.

In all there are sixteen different shortcodes. Some with variations; such as โ€œbuttonsโ€ which come in small, big, and icon. The full sixteen are listed below and the demo link will show you what each one looks like in action.

Included Shortcodes:

  • Buttons
  • Content Boxes
  • Toggled Content
  • Tabbed Content
  • Slideshow
  • Image Slider
  • Easy Tooltips
  • Social Media
  • Password Protect Your Content
  • Author Info
  • Columns
  • Custom Icon Lists
  • Corporate Pricing Tables
  • Testimonials
  • DropCaps
  • Quotes

Price: FREE wtih $89/year Membership | Demo |ย More Information

Shortcodes Ultimate

Shortcodes-Ultimate

For anyone who wants a top notch shortcode bundle that is probably more powerful, extensive, and well designed than a free plugin has any right beingโ€“this is the plugin for you. Honestly, itโ€™s rare that I come across a free plugin this well done. Iโ€™ve used thousands and reviewed hundreds over the years and this is by far one of the best. There are about 1 million users who agree with me. As well as 1,588 five star ratings on the WordPress Plugin Directory.

This plugin boasts 50+ shortcodes (the image above is slightly outdated), a shortcode generator, modern responsive design, custom CSS editor with syntax highlight, a special widget, rich API, and an incredible UX.

Included Shortcodes:

  • Headings
  • Divider
  • Pullquote
  • Quotes
  • Lists
  • Expand
  • YouTube (and ย other platforms)
  • Audio
  • Guests
  • Documents
  • Tabs
  • Spacer
  • Menu
  • Slider
  • Members
  • Scheduler
  • DropCap
  • Buttons
  • Lightbox
  • Label
  • Row
  • And many, many moreโ€ฆ

Iโ€™ve included the following video so you can see this plugin in action. If you like ย it, give it a whirl! You can download the current version (at the time of this posting) from the download link below.

Price: FREE | Download | More Information

Styles with Shortcodes for WordPress

Styles-with-shortcodes

The Styles with Shortcodes plugin is our first premium shortcodes plugin. Itโ€™s got a great buyer rating on CodeCanyon with thousands of sales and positive comments. The goal of this plugin is to make styling various elements of your site easy for non-coders.

It comes with over 100 built in shortcodes, just a few of which are listed below, and the ability to your own shortocodes. It also comes with support for custom post types, easy import/export, new responsive columns, and more.

Included Shortcodes:

  • Accordion
  • Blockquotes
  • Buttons
  • Code (syntax highlighter)
  • Colored Boxes
  • Columns
  • Dividers
  • Social Buttons
  • Maps
  • Tables
  • Tooltops
  • Picture Frames
  • Galleries
  • Overlay
  • Tabs
  • Toggles
  • And much more

Price: $28 | Demo | More Information

Vision โ€“ WordPress Shortcodes Plugin

Vision

This plugin (along with the GT Shortcodes below) has the best looking design elementโ€“such as great buttons, icons, lists and progress bars. I Quality wise Iโ€™m pretty sure all of the premium options here are on par, perhaps with some variations in support and the pure volume of features. But for most people (unless youโ€™re looking to do something very specific) any one of them will get the job done. Itโ€™s a matter of how they stand out from the others. In the case of Vision, it stands out in terms of modern design with good color choices.

Included Shortcodes:

  • Accordions and Tabs
  • Buttons
  • Circle Loaders
  • Circle Loaders (icons)
  • Columns
  • Content and Alert Boxes
  • DropCaps
  • Animated Features List
  • Image Icons
  • Number Counters
  • Pricing Boxes
  • Progress Bars
  • Pull Quotes
  • and much more.

Price: $24 | Demo | More Information

GT Shortcodes

GT-Shortcodes

GT is another strong showing with great design. A bit lighter on the quantity than the others, but I think it shows that they take care to craft each element quite nicely. All of their elements are responsive, clean/flat design, and lightweight. I was particularly impressed with their charts.

Included Shortcodes:

  • Charts
  • Lazy Load Images
  • Accordions
  • Alerts
  • Blockquotes
  • Buttons
  • Font Awesome Icons
  • Columns
  • Highlight
  • Popovers
  • Progress Bars
  • Tabs
  • Tables
  • Video
  • Tooltips
  • Banner Ads
  • Maps
  • Animations
  • and more

Price: $20 | Demo | More Information

Intense โ€“ Shortcodes and Site Builder for WordPress

Intense-Shortcodes

Our last and final shortcode plugin is actually much more than just shortcodes. I debated on whether or not to include it, because in all it becomes more of a website building system and a simple shortcode bundle, but it does include a really great set of shortcodesโ€ฆand if you happen to like the other stuff then itโ€™s a really great find.

Intense Shortcodes includes over 100 shortcodes, 17 custom post types (including books, movies, recipes, and more), a template engine, reusable code snippets, responsive design, and more.

Included Shortcodes:

  • Alerts
  • Blockquotes
  • Clients
  • Counter
  • Emphasis
  • Gallery
  • Hover Box
  • Image Compare
  • Locations
  • Post Meta Data
  • Person
  • Progress
  • Recent Books
  • Recent Locations
  • Recent Projects
  • Snippets
  • Recipes
  • Tables
  • Testimonials
  • Animations
  • Tooltip
  • Video
  • Members
  • And many more

Price: $24 | Demo | More Information

In Conclusion

Shortcodes are the ultimate solution for easy deployment of complex functions within a WordPress site. Or, for that matter, even the slightly inconvenient functions. The plugins I covered in this post are a great (and I think affordable) resource for anyone looking to get the absolute most out of WordPress shortcodes.

However, some of the more code savvy of you may wish to cut to the chase and only implement the shortcodes you wantโ€“without all the extra fluff of a massive shortcode bundle. Fair enough. I have just the bit of further reading for you. Itโ€™s a post our contributor Kevin Muldoon authored earlier this year called How to Create Shortcodes in WordPress. Give it a look!

As for everyone else, what did you think of the bundle options in this post? Did I miss any crucial ones? Let us know in the comments below.

Article Thumbnail byย yod67ย / Shutterstock.com

Divi

Want To Build Better WordPress Websites? Start Here! ๐Ÿ‘‡

Take the first step towards a better website.

Get Started
Divi
Premade Layouts

Check Out These Related Posts

Splice Video Editor: An Overview and Review

Splice Video Editor: An Overview and Review

Updated on March 10, 2023 in Tips & Tricks

Video is a valuable form of content for social media. Unfortunately, creating quality videos is usually a long process that involves moving mobile footage to a desktop app for editing. However, mobile editing is on the rise. Apps such as Splice Video Editor make it possible to efficiently create...

View Full Post
How to Use Font Awesome On Your WordPress Website

How to Use Font Awesome On Your WordPress Website

Updated on September 16, 2022 in Tips & Tricks

When given the choice between using a vector icon or a static image, it’s a good idea to go with the vector. They’re small and fast to load, and they can scale to any size without a loss of resolution. Font Awesome is a superb library of vector icons that you can use on your websites,...

View Full Post

16 Comments

  1. As is usual with Elegant Theme articles this is bullshit! You are always only bragging or marketing, but you NEVER show how to do something. Countless times I search for the DETAILS of how to do something you brag is in your themes and NEVER have I found a page that shows how.

    Every article you publish assumes the viewer has never heard of what you are writing about before. It is like you are afraid of scaring off the reader. Don’t you realize many of us WANT the scary details?

    How about something so simple like how to color an ET Box? On one page I read it is as simple as color=””, but I tried this with hex code and nothing. Should it be RGB? Hex with # preceding or not? Or does it only accept ET’s predefined color names, if there are any. And who would know any of this? You NEVER TELL!!! Pisses me off!

    As beautiful as your product is your team simply PISSES ME OFF! And I hate coming to your website because I know it is bloated with absolutely useless words. There is no real substantial help anywhere. MARKETING MARKETING MARKETING.

  2. Great Article, thanks for sharing.Shortcodes seem to make these sites easier to develop.

  3. Hello, interesting links, I will try them.
    But I’m a little confused now because I’m begun to use Divi for a new project and for a while I switch from Divi to Eleenthirteen and then all the pages done with the Divi’s PageBuilder were broken in a miriad of shortcodes that seems are not compatible with other themes. I saw the pugins list and I couldn’t see your shortcode plugin, so then I think that you implement the shortcodes in the theme, not in a separately plugin.
    You say in this post: “”shortcodes should not be tied to a specific theme. Shortcodes should come as part of a separate plugin so that regardless of the theme you are using your shortcode functionality will not break.””

    Then: I’m missing something with the Divi’s setup?

    Thanks!

  4. I have started using the ET shortcodes and so far found them excellent.

    I am hoping that Elegant Themes will continue to develop shortcodes so we can use them exclusively without worrying about compatibility issues.

    By the way the box in the “Leave a Reply” form asking you to enter your URL does not seem to like New Zealand URL’s and gives an error message but my URL is http://www.buildbusiness.co.nz

  5. Hi,
    Really useful article.

    You’ve missed the Supreme Shortcodes Plugin ๐Ÿ™‚

    Thanks,
    Supreme Factory

  6. Thanks for the excellent article and heads-up for Shortcodes Ultimate. Already loaded and will be using it shortly โ€“ indeed an amazing UX.

    =D.

  7. Interesting and useful. I personally am using the Shortcodes Ultimate Plugin. That’s a wonderful tool with a lot of possibilities to customize. Hope to read some more WP posts from you.

  8. Yes, I would vouch for Shotcodes Ultimate. I use it on almost every site I build. It’s wonderful and nice features are there. Nice article by the way..

  9. Thank you for this article. Will be trying it out. I am new to wordpress and doing all the work on my website, still trying to imp it up ๐Ÿ˜‰ Thank you

  10. Nice one Nathan, very amazing and informative. ET shortcode is one of the best I can vouch for follow by ultimate shortcode. Most of the time I pick ultimate shortcode for obvious reasons but I will head over to try the other shortcodes you listed.

    How far with Extra? Right now, I don’t even know the features that will be in the said super mag theme b’cos there were no survey (for ET users) to pick the intended features (like Divi) we would want the theme to have. More info will chill our hormones.

    Have a great day.

  11. The only problem I have with ET shortcodes is that it’s not easy to find the actual codes on the site anywhere, ie the page linked to in the article shows the effects but not how to achieve them.

    Anyone else wondering, this is the page I bookmarked….

    http://www.elegantthemes.com/preview/TheProfessional/357-2/

    If there is a more up to date or better page, please post it up.

  12. GREAT point re where shortcodes should live, and you couldn’t be more right. I’ve been playing with a theme called X, and it … writes code that just won’t work AT ALL if you ever change themes.

    A pity, because at first glance it looks like an even better Divi, but because of the design … no.

  13. How I Can put my avatar in this Blog? Thanks!!

    • To put your avatar here any pretty much everywhere, go to gravatar.com and sign-up or sign-in using your WordPress.com membership and follow the instructions to upload and use avatars for various email addresses.

  14. The ShotCodes of elegant themes are enough, however those who like variety, may opt for one payment. Some of the aforementioned plugin sometimes are not compatible with ET themes (sometimes)

  15. Thanks! Just today I started playing with shortcodes ๐Ÿ™‚

Leave A Reply

Comments are reviewed and must adhere to our comments policy.

Get Started With Divi