Home » Read & Learn » WordPress » What are WordPress Shortcodes?

What are WordPress Shortcodes?

How to use WordPress shortcodes.

If you have a WordPress website, you’ve probably used, heard about, or even unknowingly used shortcodes. You may have noticed the shortcode widget in Gutenberg or offered by various plugins. But what the heck are shortcodes — exactly?

Shortcodes are text snippets within box brackets that tell WordPress to do certain things when that shortcode is present within a page or post. You add a specified shortcode, and WordPress runs the background code.

WordPress Shortcode Widget

Before shortcodes, you had to write PHP code to create your desired layout or functionality. Now, with the help of talented developers, themes and plugins do all that for you. Then, you insert the provided shortcode and whallah.

If you have a WordPress website, you have probably used the gallery shortcode at some point. It looks something like this:

.

This is the basic shortcode that WordPress inserts into a post when you use the Gallery block to display a gallery of photos on a page or post that you uploaded into WordPress. In addition, you can add attributes such as size, columns, id, type, include, exclude, and more to customize the gallery’s display further.

For example:

The above shortcode tells WordPress to display gallery three in two columns in ascending order.

A Little Shortcode History

Introduced on March 29, 2008 in WordPress 2.5, the Shortcode API, is a simple set of functions for creating macro codes for use in post content. It enables plugin and theme 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.

Common examples of shortcode use are for embedding contact forms. Once your form is set up to your liking in the plugin’s control panel, insert the provided shortcode into a shortcode block on the desired page, and wallah.

Many form plugins now have their own form widget, negating the need for manual shortcode input. You insert the form plugin widget into your page, choose the form in the plugin’s widget, and the form is inserted and will display just as you set it up.

Before WordPress existed, my Project Inquiry form would have required minimal HTML coding and a server-side CGI script that had to be configured. Now, with just a couple of brackets and characters, anyone can add formatting to their site that would have been otherwise unavailable to non-developers.

Rare is the theme or plugin developer that is not using the WordPress Shortcode API to offer shortcodes that make formatting or using their products much easier.

Can you create your own shortcodes on the fly?

The Gutenberg Editor added with WordPress 5.0 includes blocks that handle shortcodes. When converting content to Gutenberg, the “Convert to Blocks” option transforms existing shortcodes into a shortcode block.

However, WordPress’s built-in default set of shortcodes for those still using the Classic Editor plugin, so you can delay using the default Gutenberg Editor is still available. But it’s time to get into the present, as the Classic Editor plugin is not long for this world.

TAKE THE PLUNGE: Click the Convert to Blocks button (top left of your screen) to begin getting used to and working with blocks. It won’t hurt—I promise. You can do it in a post/page at a time.

Shortcode use and integration vary by theme, developer, and plugin. When investigating new themes, you may find a menu tab within the theme demo titled “Shortcodes” to see what built-in custom shortcodes are available to insert where you want.

An example of a theme that creates a website dependent on shortcodes is Divi by Elegant Themes. ET uses shortcodes extensively in their Divi All-In-One WordPress Theme & Visual Page Builder. While this approach makes visually designing a website uber easy for non-developers, if you choose to discontinue using Divi, you’ll have to remove all those shortcodes, which can be a complicated process.
[More about “Builders” here…]

Example Functionality of Shortcodes

Other examples of how shortcodes are used and integrated via themes and plugins:

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

There is a varied selection of Shortcode-related plugins for you to choose from and use on your site in the WordPress plugin repository. With the help of shortcodes, you can customize your site even further without knowing any actual code.

It’s sort of like magic.

At your service,

Trusted and Reliable WordPress Products and Services