Your Shortcode is Showing!
By Ben Fox
You’ve designed this beautiful WordPress website. Sleek, powerful, professional…everything you ever imagined your dream site could do.
But…something is awfully wrong. It’s written on your Facebook page. You’ve been tweeted at. Tickets have piled up…those dreaded words…”hey, your shortcode is showing!”
Oh the embarrassment! Oh the shame!
As you put a grocery bag over your head, you realize all professionalism is lost.
Ok, maybe this has never happened to you, but to be sure it never occurs, let’s review what a shortcode is, and how you can prevent it from showing on your WordPress site.
What is a WordPress shortcode?
Shortcodes were introduced to us in WordPress 2.5. The primary shortcode function is to allow us to execute code on posts, pages, etc. without having to directly write code. Instead, we can use these nifty little pieces of code that will execute a larger command out of sight.
Why is it easier to create shortcode?
Shortcodes are awesome! Let’s say you want to embed a “Follow Us on Twitter” button at the bottom of your post. Rather than having to embed something like this to follow WP Engine:
<a href="https://twitter.com/wpengine" class="twitter-follow-button" data-show-count="false">Follow @wpengine</a><script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>
With a basic shortcode, you can install and activate the Twitter plugin and do something like this:
[twitter_follow screen_name="wpengine"]
Way easier! Way cleaner!
Why does a shortcode show?
Well this can be a bit of a rabbit-hole.
WordPress Shortcodes are executed in WordPress core, so the common reasons your users can see your shortcodes on the front-end of your WordPress website include:
- You have a WordPress plugin interfering with the shortcodes
- You have a theme interfering with the shortcodes
- You’re somehow running an old enough version of WordPress that doesn’t support shortcodes
- The shortcode you’re attempting to execute requires an associated plugin you’ve yet to install/activate
- You’ve made a spelling mistake (more common than you think)
- If the shortcode can take an src attribute, it’s possible that the source can’t be found or that it simply doesn’t exist
There’s many, many more possible situations, but these are common issues with users who are new to shortcodes.
How do you prevent a WP shortcode from showing?
To prevent shortcodes from appearing to your end-users, all you need to do is preview before publishing. Then when you’re about to publish, save again, and preview changes again…then you may publish.
Plugins like this one can help you hide broken shortcodes from the reader as well. This is great for keeping your shortcode out of your post or page content, but you’ll still be without the functionality you’re seeking from the shortcode. 🙁
What are the downfalls?
Shortcodes are really awesome and super-helpful, but make sure you’re testing them consistently. Sometimes a new update of WordPress can mess with a plugin, and if you’re using that plugin for a specific custom shortcode…now it’s broken! It’s on you to keep track of your shortcodes and properly test your site frequently from a user’s perspective.
How do you get a shortcode to stop from showing?
Check out the WordPress shortcode Plugin I recommended above and, if you’re new to WordPress, a safe bet is to get your feet wet with the basic WordPress built-in shortcodes such as [video], [gallery], , [caption], and [audio].
Ben Fox is the Co-Founder and CEO of FlowPress, a Toronto-based agency that specializes in WebOps for WordPress. Ben is also the Co-Founder of SIDEKICK, a plugin that provides real-time, voice guided Walkthroughs right inside WordPress.