A Custom Guide to Add Shortcodes in WordPress

A Custom Guide to Add Shortcodes in WordPress

Add Shortcode in WordPress: Struggling with how to add shortcodes to the WordPress website? Keep this article pinned on your device as you will get the vital answers on this.

Shortcodes are shortcut codes that when added to the website allow the addition of dynamic content. It can be easily added to WordPress posts, pages, and other locations. This comes in a single line enclosed in square brackets to generate any content. In short, users are allowed to add a custom code to the function and then run that function using a shortcode. This is a great way for non-developers to use shortcodes even without any technical knowledge.

Though, WordPress has made it far easier to add dynamic content without using codes. Still, some parts of the website like banner ads and galleries can't work without a shortcode. So if you are one of those who wish to add shortcodes, can refer to the below article.

Creating a Custom Shortcode in WordPress

Ready to build your first custom shortcode in WordPress? Let’s get started.
Shortcodes can work as a vital supplement for your website when in need to add dynamic content. You can simply add some shortcodes that result in nifty results for your website. So, here’s how you can create a custom shortcode in WordPress:
This guide is a clear chit for those skilled in coding languages like PHP. We are going to use PHP code that can be used as a sample template.
Here, we are creating a function running the code and returning the output. After this, another shortcode will be created named “Greetings” that will run the function.

// function that runs when the shortcode is called
function wpb_demo_shortcode() {
// Things that you want to do.
$message = 'Hello world!';
// Output needs to be return
return $message;
}
// register shortcode
add_shortcode('greeting', 'wpb_demo_shortcode');

This will further help in inserting the shortcode into any part of the website using the below shortcode:

This will ultimately generate the desired output for the function you created.

  • Adding Shortcodes in Different Areas of WordPress Website
  • Adding Shortcodes in WordPress Posts and Pages
  • Adding Shortcodes in Sidebar widgets
  • Adding Shortcodes in Old Classic Editor
  • Adding Shortcodes in WordPress Theme Files
  • Adding Shortcodes in WordPress Templates

Adding Shortcodes in WordPress Posts and Pages

  • Now that you know how to create a custom shortcode, let’s move ahead to add shortcodes to pages and posts. To add shortcodes in posts and pages, follow the given steps:
  • On your WordPress dashboard, tap the posts or pages option. We are going to edit the page by clicking on it.
  • Next, you will reach the list of pages you have created previously. You need to tap the Edit link under the page you wish to edit.
  • This will take you to the page editor and then tap the “+” icon to explore the blocks.
  • Simply search for the shortcode block and tap to insert it on the page.
  • Once the block is inserted, enter the previously created shortcode and tap the Save Changes button.
  • You can now be able to watch out for the results after inserting the shortcode.

 

Adding Shortcodes in WordPress Sidebar Widgets

  • Just like the posts and pages, you can add shortcodes in the sidebar widgets as well. And here's the perfect guide on this:
  • Visit the WordPress dashboard and then on the Appearance tab.
  • Choose the Widgets option among various options under the Appearance tab.
  • This will take you to the Widgets page and then tap the “+” icon to explore the widgets blocks.
  • Here, you need to search the Shortcode block and tap to insert.
  • Simply add the shortcode we generated earlier and tap the Update button at the top right corner.
  • Head back to the website and see the live changes of the widgets after entering the shortcode.

Adding Shortcodes in WordPress Old Classic Editor

This one is for those who still choose to use the old classic editor for their website editing purposes. And here’s how you can add shortcodes to the posts or pages using the old classic editor:

  • Here, we are going to edit the previously created post on your website.
  • On your WordPress dashboard, pick to click the Post option.
  • And now, you need to tap the Edit link under the post you have chosen to edit.
  • On the edit screen, simply paste the shortcode where you wish to be displayed.
  • Lastly, tap the Save Changes button to store the new changes.

Adding Shortcodes in WordPress Theme Files

We have previously added shortcodes in WordPress posts, pages, and sidebars. Surprisingly, WordPress allows the addition of shortcodes in its theme files as well.
And those with coding skills will find it easy to edit WordPress theme files and add a shortcode.
Here’s an example as we are adding the below line of code in the WordPress theme template:

Here, you must add the shortcode generated in place of “your_shortcode”. This will further give the desired result.

Which is better: Adding Shortcodes or Gutenberg Blocks?

  • The question has been a hot topic to discuss since the launch of the Gutenberg editor. Earlier, users only relied on the shortcodes and the classic editor.
  • The newly launched Gutenberg editor comes with intuitive blocks that seem to be more user-friendly.
  • While the shortcodes and the blocks result in the same output. But as of latest technology approaches, users find Gutenberg blocks easier.
  • The shortcodes can be a good game for the coding person only. But the Gutenberg Blocks can be easily used by a non-technical person as well.
  • Users find it so easy to add dynamic content using the Gutenberg blocks within a couple of times. Even a lot of WordPress plugins are adapting to the Gutenberg Blocks instead of the shortcodes.

Conclusion

So, have you got the right answers to all your queries related to Adding Shortcodes in WordPress? We have made it so easy to understand by adding shortcodes. Shortcodes can be a great way to add dynamic content to your website. And so, the above content will help you refer to the best details about adding shortcodes in WordPress.

Back to blog