While working on WordPress, you must have come across the term WordPress shortcodes on many occasions whether you are going to implement Google ads on your website to add pop-up windows. Do you ever wonder what exactly these WordPress shortcodes are, How do they work, and how to create them?
No doubt, these shortcodes replace complex and long codes that may look intimidating for any individual and increase the complexity of a website. They look like just a piece of small code, enclosed by brackets ” [WordPress shortcodes] “, that has the potential to perform complex functions on your website.
They can be easily added to any part of the website, whether it is the header/footer, in between the contents, or anywhere on the webpage where you would like to add a specific function. No matter whether, it is a contact form, Picture gallery, videos, or playlist.
If you are still wondering what are WordPress shortcodes and want to get all the details regarding this term, then keep reading this post that will help you to learn almost everything about WordPress shortcodes and How you can leverage their benefits.
As we know, WordPress is an open-source platform, that has limitless customization options and flexibility. Including adding codes or editing the existing ones to your website. But the only problem is everyone is not a tech enthusiast or a geek. Hence, majority of the WordPress users do not like to play with the complexity of codes and understand them.
To their rescue, WordPress shortcodes have been developed. With the help of these shortcodes, one can achieve the same results as a developer would implement on a website by writing codes.
Let us see, How these WordPress Shortcodes exactly look like:
WordPress Shortcodes
Usually, Shortcodes do the work that they are supposed to do. To better understand it, let us take an example, in the above picture you can easily see an audio shortcode has been added to your website that has the ability to add audio files on your website. On the front end, you can easily see the WordPress Shortcodes pasted on the webpage but there have been a lot of things that will happen behind the scenes. The WordPress shortcode will communicate with your WordPress and give instructions to run a complete set of programs with WordPress files.
Now, many of you will raise questions about Where these WordPress Shortcodes come from and how can anyone generate them. Where can you easily detect them?
Well, all this can happen due to the core integration of multiple WordPress plugins that are by default present. However, there is also a certain external plugin that you can install and they generate their own shortcodes, that you will require them to paste on your website wherever you want to.
To better understand this, let us take an example of Contact form plugins. You install a Contact Form plugin on your WordPress, create a Form, and generate its source code which can be pasted on the desired location of your Website. In return, it will show a Contact form rather than some WordPress source code. Similarly, there are multiple plugins available on the WordPress repository with the help of them you can generate numerous shortcodes.
Types of WordPress Shortcodes
In general, there are two types of WordPress shortcodes:
Self-closing Shortcodes
Enclosing Shortcodes
One thing you must remember is that both these types of WordPress Shortcodes can be valid whether it contain attributes or not. It solely depends on how they are defined.
However, Self-closing Shortcodes do not require a closing tag but when we talk about enclosing shortcodes, they require a closing tag and they usually make some changes in the content between the opening and closing tags.
What are the most commonly used WordPres Shortcodes?
I hope you have now got a basic idea of what are WordPress shortcodes and how they can make things a lot easier. Now, it is time to discuss what WordPress shortcodes you use generally in WordPress and How to use them.
But before we proceed further, let me introduce you to some of the most common default WordPress shortcodes you may have come across:
Gallery: Let you add a beautiful image gallery on your website.
Video: Let you play video files on your website.
Audio: Let you embed an audio file so that it can be playback.
Playlist: Let you create a playlist of all videos and audio files.
Contents: Let you create a list of contents in a Post.
Caption: Let you embed Captions of your content.
Embed: Let you set the desired dimension possible for any embedded item whether it is an image or anything else.
The above WordPress shortcodes are not much different from any other shortcode available. You can simply copy the shortcode and paste it directly to the desired location of the website. Generally, you can add shortcodes in any location of the website where the WordPress editor allows you.
To add a WordPress shortcode, there are two options available. You can use either a Text editor or a Visual.
Add a new post
From the above picture you can easily see, we have used textual editor rather than Visual, it is because, when you click on the visual tab you can easily see the feature that you have added rather than the shortcode. You will be provided with an edit option to customize further according to your need.
Add a new post on WordPress
Another thing, you must note is that we have only used the most simple WordPress shortcodes as an example, But some other shortcodes can be customized and altered the way they would appear. For example, a contact form plugin will let you create a shortcode that displays a Form, exactly how you’d like them to appear. If you are worried about how to implement them, then you do not need to worry about them. Certain plugins come with proper manuals and documentation that will guide you through all this.
Now you have learned about what WordPress shortcodes are and Some default Shortcodes that WordPress is built with. It is time to learn, How and Where you can put WordPress shortcodes on your websites.
How can you add WordPress shortcodes?
WordPress shortcodes are one of the best things that offer limitless customization and little changes in your website by simply adding some small codes. And in return, a complex feature is added to your website. You are not required to be a hardcore coder or have complete knowledge of coding. Just create, copy, and paste at the desired location of your website.
But, creating and adding them to your website is not enough, you also need to learn how to use them the most efficient and correct way.
As far now, you got the most common and basic questions answered. i.e. What are WordPress shortcodes? But now, it is time for you to learn the art of adding shortcodes that work perfectly. By default, WordPress has provided you with some default options to add a plugin, but with the help of some other plugins, you can even add more shortcode choices. Which we will talk about in a later section of this article.
1. How to Add WordPress shortcodes in WordPress posts and pages.
The first step is to make sure at what location of your post or page of a website, you would like to add a shortcode. Once, you decided on the location, all you need is to click on the Add block button to add a shortcode block as shown in the picture below:
WordPress shortcodes
once you have added the shortcode block, all you need to do is paste the shortcode that is provided by various WordPress plugins such as contact forms, Gallery plugin, and many more.
adding a shortcode
After adding a shortcode, you can save your post or page and click on the preview button to check out how will the shortcode will appear in action.
2, How to Add Shortcode in WordPress Sidebar Widgets?
To your knowledge, you can also add shortcodes in WordPress sidebar widgets. To do this, go to your WordPress dashboard > Appearance > Widgets and add the Text Widget to the sidebar.
WordPress Shortcodes
Add your Shortcode in the text section as shown in the picture above. Click on the “Save” button to make changes effective. Now, when you are done adding shortcodes on the WordPress widget, go back to your website URL to see how the changes appear.
3. How to Add Shortcodes in Old WordPress Classic Editor?
WordPress Classic Editor is one of the oldest tools that many individuals prefer to work on. Hence, let us see how you can add shortcodes in the old WordPress classic editor.
WordPress classic editor
After you are done with editing or writing content for posts or pages, you can simply add a shortcode wherever you want to display it, in between the content or below it. But be sure you are using the correct shortcode while pasting. Once you are done, click on the save button to save the changes. After that, you can check how it would appear by clicking on the preview button.
How do things work in shortcodes?
There might be a question that will arise in the mind of most people, How a simple, short, and one-line code can add such complex features to a website? The answer is simple when you add or paste a shortcode in your page or post. It is replaced by some function in the backend. In other words, by using shortcodes, we actually give instructions to WordPress to find out the macro, that has been put into the brackets “[shortcode]” and the PHP function generates dynamic content and replaces it with the code in the brackets.
Is it possible to add more shortcode options to your website?
The simple and direct answer to this is yes, it is possible to add more shortcode options to your Website. You do not need to indulge yourself in complex coding and tampering with WordPress core files. All you need to do is install some WordPress plugins that offer a whole range of new WordPress shortcode options. Just search for a suitable plugin from various marketplaces and check their manuals that help you out what are the options they provide and install accordingly.
For your convenience, we found WordPress Shortcodes plugin-Shortcodes Ultimate, which is the best free WordPress shortcode plugin available in the WordPress directory.
Shortcode Ultimate is one the best Free WordPress shortcode plugin in the market. It offers a quite long range of different visual elements as well as functional elements. Which you can add wherever you want on your website, whether it is widgets, post editor or template files.
Using this amazing plugin you can easily create tabs, buttons, boxes, sliders and carousels, responsive videos, and much, much more.
Some key features
A collection of more than 50 beautiful shortcodes
Custom CSS editor
Developer Friendly
Gutenberg ready
Works well with the majority of the themes
You increase functionality using Addons
Pricing
It is available to download from the WordPress directory without any cost (FREE).
How Do the Installation and Setup Look like
The installation of these WordPress shortcode plugins is quite simple. You need to go to the ‘Plugins’ section in your admin panel. Search for the ‘WordPress shortcodes plugin’ and click on the ‘Install Now’ button. This way, the plugin will be successfully installed on your WordPress; after installing, press the ‘Activate’ button beside the plugin.
WordPress shortcodes plugin
After you are done with the installation and activation part, you’ll find the plugin in the sidebar of your Dashboard.
WordPress shortcodes Plugin installation and activation
WordPress shortcodes Plugin Updates And Reviews
We checked with WordPress shortcodes plugin customer reviews in the WordPress directory and the kind of updates their developer has been pushing and found the following results for its version – 5.10.1
It has 800000 + active installations right now.
For us, it shows that it was updated 3 weeks ago. [ Regular Updates ]
It has been currently tested up to 5.7.2.
According to the WordPress Directory, its average rating is Average Rating 4.9/5. 5238 users out of 5621 gave it 5 stars.
WordPress shortcodes Plugin Updates And Reviews
If you are looking for some other premium plugins that offer more options, you can go for Vision, Intense, and many more.
Is it wrong to use WordPress Shortcodes for your Website?
In short and clearly speaking, No!, it is not wrong to use WordPress shortcodes for your website, but you need to be careful while using Shortcodes. If you have installed a new plugin or theme that comes with its own shortcodes, once you remove or disable them, the shortcode will no longer work.
Hence, you must keep this point in mind and take all necessary precautionary measures.
How to create a custom Shortcode and execute it?
To make you better understand how these Shortcodes are created and executed, we are taking a simple shortcode as an example.
In this example, we are creating a simple shortcode for recent posts as shown below:
[recent-posts]
Do remember one thing, this shortcode is a simple one and you do not need to have any high-level PHP knowledge. To create a simple shortcode, you need to follow these easy steps:
Step 1: You need to create a function first so that whenever WordPress finds a shortcode, it can easily call that function.
Step 2: After creating a function, register it with a distinct name.
Step 3: The final step is to connect the function that you have already registered with the WordPress action.
One thing you must keep in mind is that All the codes that we are using in the example either can be stored in functions.php or create a new PHP file and store it in the functions.php file.
Creating a Callback Function
The callback function is a piece of code that is being called whenever WordPress detects a shortcode. Hence, in our simple shortcode of recent posts, we are going to create a Callback function that will fetch recent posts of a website from the database.
function recent_posts_function() { query_posts(array('orderby' => 'date', 'order' => 'DESC' , 'showposts' => 1)); if (have_posts()) : while (have_posts()) : the_post(); $return_string = '<a href="'.get_permalink().'">'.get_the_title().'</a>'; endwhile; endif; wp_reset_query(); return $return_string; }
From the above code, you can see, that we are querying the database that will provide recent posts from the database and return a string.
Registering the Shortcode
Registering the Shortcode means we are letting know WordPress that the function is a shortcode. To do this we are using the following code:
function register_shortcodes(){ add_shortcode('recent-posts', 'recent_posts_function'); }
Now, our shortcode will work when a shortcode is detected by WordPress. WordPress will automatically call back the function recent_posts_function( ) that we have created.
Tieing With WordPress action
The last and final step to make your shortcode work and executable is to tie your register_shortcodes( ) function with WordPress action.
add_action( 'init', 'register_shortcodes');
Now after tying your registered shortcode with WordPress action, it is time for the final testing. Just copy the shortcode wherever you want on your WordPress website and see if it is working.\
Some Pros and Cons of Using WordPress Shortcodes
Pros
Reduces complex coding efforts and makes the whole process simple by just adding a single line of code.
Shortcode tends to be more user-friendly rather than adding codes in PHP files.
Some shortcodes come bundled with plugins, so even after updating the theme, it will be still valid and work fine.
You can use the same shortcode that has been bundled with plugins on various websites without any problem.
Accepts Attributes
Cons
If your shortcodes are bundled with the theme, after updating it, it may not work like before.
It is impossible to say just by looking at the shortcode about its features or functionality.
If you add multiple shortcodes on a website, it will add an extra burden on the server.
If you are using multiple shortcodes, that would be not intuitive at the user end. Hence, it is best suited for developers.
Shortcodes are ambiguous regarding their syntax.
Difference between Shortcodes and Gutenberg blocks
You might have been confused between Shortcodes and Gutenberg blocks and even curious to know what would be the major differences that make these two terms distinctive. These two features of WordPress are not new and it has been found that many plugins are moving towards blocks rather than shortcodes. It is only due to the fact that blocks tend to be more user-friendly than shortcodes.
Despite using Shortcodes to display dynamic content on your website, Gutenberg blocks let users add the same dynamic content in a more user-friendly way. This is why it is gaining more popularity than using shortcodes.
Summary
WordPress shortcodes can make wonders for anyone who does not know coding or any other technical stuff. It allows a user to add complex functionality to the website wherever they want without any restriction. And then another that we love the most about WordPress is that it allows users to create, customize, and edit anything.
If you are unable to find the shortcode that you are looking for. Just create it on your own and use it on your website. There are even multiple WordPress plugins available that can help you create your own custom shortcode without any problem.
And it is worth using a shortcode rather than indulging yourself in Complex coding. After all, the final result matters no matter what efforts you have made to make it.
We hope you find this article informative enough to clear your all doubts about WordPress shortcodes. Or if you find anything that we have to forget to mention in this article please do let us know in the comment section below. We would love to hear from you.
Frequently Asked Questions
What are the shortcodes in WordPress?
Shortcodes are simple, one-liner codes that are written in closed brackets and are used as an easy way to add functions or features to your WordPress site. There are many plugins and themes that are now using shortcodes to add dynamic content on websites, such as recent posts, calendars, slide shows, contact forms, etc.
Where are WordPress shortcodes stored?
Usually, WordPress Shortcodes are stored in the post or the website pages. However, a user has no restriction on storing a shortcode and can add it wherever the WordPress editor allows them. Whether, it is at the header of the website, footer, or in the widgets.
How do shortcodes work?
when you add or paste a shortcode in your page or post. It is replaced by some function in the backend. In other words, by using shortcodes, we actually give instructions to WordPress to find out the macro, that has been put into the brackets “[shortcode]” and the PHP function generates dynamic content and replaces it with the code in the brackets.
Rahul Kumar is a web enthusiast, and content strategist specializing in WordPress & web hosting. With years of experience and a commitment to staying up-to-date with industry trends, he creates effective online strategies that drive traffic, boosts engagement, and increase conversions. Rahul’s attention to detail and ability to craft compelling content makes him a valuable asset to any brand looking to improve its online presence.
