How to Use WordPress do_shortcode
For many WordPress developers, shortcodes are a great way of extending the core functionalities of the WordPress core. In fact, all popular plugins now use shortcodes to integrate their features and options within posts and pages of the site.
Table of Content
Now, what if you need to use shortcodes on the website other than the posts and pages. This opens up a host of possibilities for using shortcodes almost anywhere on the website.
In this short tutorial on WordPress do_shortcode(), I will highlight several ways in which you can leverage this great idea into your website.
Custom Message do_shortcode
A very simple use case of WordPress do_shortcode() is adding a custom message “A simple do shortcode demo” at the location of your choice. The following snippet inserts the message or keyword at the location where the shortcode is placed.
1 2 3 4 |
function wp_do_shortcode() { return 'A simple do shortcode demo'; } add_shortcode('do_shortcode', 'wp_do_shortcode'); |
In the above code snippet, wp_do_shortcode is the name of the custom function that integrates do_shortcode() functionality into your website. The return statement contains the actual message or keyword that needs to be inserted.
Finally, in the add_shortcode(), you can see that the actual shortcode to be inserted is “do_shortcode”.
As you can see in the following screenshots, when the shortcode, do_shortcode is used:
You can see that the shortcode gets replaced by the message in the return statement.
Adding Parameters to the do_shortcode Function
Now that you know the basic structure of a do_shortcode() and how to use it in your code, I will present another example that allows you to use the idea more effectively. In this example, I will demonstrate how to add the dimensions of an image to the page. For this, check out the following code:
1 2 3 4 5 6 7 8 9 |
function parameter_att_do_shortcode($atts) { extract(shortcode_atts(array( 'width' => 100, 'height' => 150, ), $atts)); return '<img src="https://abc.com/'. $width . '/'. $height . '" />'; } add_shortcode('do_shortcode ', 'parameter_att_do_shortcode'); |
As you can see, the function parameter_att_do_shortcode() takes the parameters in the $atts. In order to make use of the user-provided parameters, I have used shortcode_atts() that takes in user-provided attributes and fill in the gaps with default arguments.
Build a Custom do_shortcode Plugin
If you wish to create a plugin to add do_shortcode functionality to your website, the process is pretty straightforward.
The process of creating the plugin is simple. Just create a new folder in the wp-cont/Plugins. in the new folder, create a file named plugin-name-seokeyword.php. open the file and add the following code snippet to it.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 |
<?php /* Plugin Name: seo suggested do shortcode Integration Plugin Description: add a description with seo suggest keyword This plugin extends the default do_shortcode functunality and makes shortcodes available across all widgetized areas Version: 1.0 Author: Muhammad Owais Alam */ function wp_do_shortcode() { return 'A simple do shortcode demo'; } add_shortcode('do_shortcode', 'wp_do_shortcode'); function parameter_att_do_shortcode($atts) { extract(shortcode_atts(array( 'width' => 100, 'height' => 150, ), $atts)); return '<img src="https://abc.com/'. $width . '/'. $height . '" />'; } add_shortcode('do_shortcode ', 'parameter_att_do_shortcode'); |
Template to Register the Shortcode
Before using the shortcode plugin, you need to register the shortcode. For this, you need to create a separate file with the following function wordpress_do_shortcode_form().
1 2 3 4 5 6 |
function wordpress_do_shortcode_form() { ob_start(); get_template_part('template-name'); return ob_get_clean(); } add_shortcode( 'wordpress_do_shortcode_form', 'wordpress_do_shortcode_form' ); |
Wrapping Up
Shortcodes are a popular way of adding functionalities to the WordPress core. With the above-mentioned solution, you can extend the usability and application of shortcodes to all areas of the WordPress website. If you need help in implementing the idea at your site, do let me know in the comments.
Create Faster WordPress Websites!
Free eBook on WordPress Performance right in your inbox.