Are you creating a WordPress site and you have come across Shortcodes but have no idea how to use Shortcodes in a page or post?
This is a very common scenario for the majority of WordPress new users. Today, I want us to focus on how to use WordPress Shortcodes in a page or post.
WordPress Shortcodes
Most of my clients always ask me about Shortcodes after reading the documentation I write after creating websites with WordPress.
I would like to share the most basic approach to WordPress Shortcodes and how to use them for complete beginners.
What is a WordPress Shortcode?
Shortcode comprises of word or number words enclosed in corner brackets like this – [njengah]. This is one of the simplest examples of a WordPress Shortcode.
Shortcodes can be single like the example above or can have an opening and closing Shortcodes – [njengah] ……[/njengah].
When Shortcodes exist in pairs you must make sure you have both the opening and the closing Shortcodes for it to work.
Why Use WordPress Shortcodes?
Shortcodes are created by theme or WordPress plugin developers to help users who have little or no knowledge of coding to implement some layout modification or introduce functionality without writing a single line of code.
Easy to Use
The basic idea of using Shortcodes is to save time and customize WordPress themes and plugins without messing with the code.
Ideally, Shortcodes are created by a specific plugin or theme authors and they give users the documentation on how to use them.
Example – Contact Form 7 Plugin
For instance, the most popular WordPress contact form plugin comes with a Shortcode that enables users to quickly publish the contact form on any page or post.
Where do you find Shortcodes?
WordPress Shortcodes can be found anywhere on your WordPress site, the most common places you can add Shortcodes include posts, pages, custom post types, and widgets. For this tutorial, we will focus on adding Shortcodes to pages and posts.
Adding Shortcodes to Page or Post
Basically, adding a Shortcode to a page or post is the same as the steps. You need to first identify the Shortcode you want to add to the WordPress page or post, then click on the menu to create a page or a post as shown in the image below:
Adding Contact Form 7 Shortcode to a Page or Post
For this tutorial, we will be adding the Contact Form 7 shortcode to a page to publish the contact form. This tutorial presumes you know how to install and activate a WordPress plugin.
Install the Contact Form 7 Plugin & Create a Form
We need to first install this plugin – Contact Form 7, and then create a basic contact form by adding the name and saving the setting as shown in the image below:
Copy Shortcode to WordPress Page or Post
Now we need to copy the shortcode generated when we saved the form settings and paste it on our new WordPress page or post. You can add more information on the page as you wish before you publish the new page with the contact form WordPress shortcode.
It is also important to note that when adding WordPress shortcodes to a page or post, you need to ensure you are in the visual mode of the WordPress post or page editor.
Publish the Page or Post and Review
Save and publish the page to see the shortcode functionality on the live site. As you can see in the image below, the shortcode introduced to the page a new functionality of the contact form that works. This not only takes a few minutes to implement but also can be done by every WordPress user irrespective of their coding skills.
Conclusion
WordPress shortcodes by design are meant to save time and make it easy for users to customize their sites without worries.
There are dozens of shortcodes that can be added to pages and posts. Nearly, all WordPress themes and plugins come with shortcode functionality and you can utilize them to customize and add unique features to your WordPress site. If you are not sure how a certain shortcode works, you may seek guidance and help from a WordPress developer.
Joe is an experienced full-stack web developer with a decade of industry experience in the LAMP & MERN stacks, WordPress, WooCommerce, and JavaScript – (diverse portfolio). He has a passion for creating elegant and user-friendly solutions and thrives in collaborative environments. In his spare time, he enjoys exploring new tech trends, tinkering with new tools, and contributing to open-source projects. You can hire me here for your next project.
Comments are closed.