WordPress Shortcode API- A complete guide on utilizing it the right way

Gone are the days when WordPress website administrators had to invest a great deal of time and effort on embedding dynamic function in multiple plugins or themes via HTML coding. Thanks to the concept of shortcodes that came into existence with the release of WordPress version 2.5. It has now become possible to embed dynamic function into any theme or plugin using the shortcodes. In today’s post, I’ll be highlighting how you can utilize shortcode API for enhancing the capability of using shortcodes within WordPress.

What’s the reason behind using Shortcodes in WordPress?

If you’re interested in modifying the look and feel of your site’s content and template, then shortcodes can serve as the most appropriate options. Whether it’s about including videos, text, images, maps, buttons etc; shortcodes allow you to add a tint of uniqueness into your website’s content. Plus, you can even utilize them for insert a special kind of functionality into areas of content, which are usually unreachable. For instance, shortcodes can be utilized for adding a call-to-action button into your header or for adding testimonials into the sidebar. To sum it up, when it comes to attaining complete control over your WordPress website’s behavior, shortcodes are tools that are surely going to help you to the fullest.

Now, let’s have a closer look at Shortcode API used in WordPress

Shortcode API offers you a remarkable means of creating your own set of shortcodes which can further be utilized for creating exclusive contents like contact forms etc. You can then opt for attaching these contact forms with certain web pages via embedding a related shortcode. One of the greatest things about Shortcode API is that it eliminates the need for writing a custom regular expression for each shortcode that’s been included within the post. WordPress automatically detects the shortcode, calls the related function and finally replaces the respective shortcode with the related text.

Finally, let’s come to the steps associated with creation of a shortcode in WordPress

Step 1- Register Handler function

When using Shortcode API for creating shortcode, the very first step is to register the shortcode with the WordPress default called called add_shortcode(). This function handles two separate variables viz: callback function and the name of shortcode that needs to be used. Here, one condition is applicable for the callback function- the content which will replace the shortcode should be identified in “return” instruction. After this, you’ll need to choose from the below mentioned parameters, which can further be tied with the corresponding callback function:

• $atts-  use this parameter if you want to define an array of attributes in the shortcode
• $content- use this parameter if you want to use the shortcode in the enclosed form
• $tag- use this shortcode tag for all shared callback functions

The below mentioned API will inform you about the method that must be used for registering the shortcode handler:

<?php add_shortcode( ‘customshortcode’, ‘customshortcode_function’ ); ?>

For instance, if the template tag i.e. the_content is being found, the shortcode API would automatically parse the registered shortcodes called the customshortcode. After this, the content and attribute will be separated and further passed on to the shortcode handler. Hence, it is vital to make a note of the fact that every string that’s returned by the shortcode handler will replace the shortcode automatically, while the same is being placed within the WordPress posts/pages.

Step 2- Use a PHP snippet

Below is a PHP snippet which will allow you to create the shortcode:
<?php
//[newrule]
function customshortcode_function( $atts ){
return “new and rule”;
}
add_shortcode( ‘customshortcode’, ‘customshortcode_function’ );
?>
On executing the above code snippet, a [newrule] shortcode will be created which will return two values: new and return.
Next, there is a code which lets you add attributes for shortcode:

[customshortcode new="rule" rule="follow"];

Finally, the added attributes are being converted into an associative array like this:

array( ‘new’ => ‘rule’, ‘rule’ => ‘follow’ );

If you observe the above function carefully, the array keys represent attribute names and attribute values denote the values assigned to those attributes. Here, I’ve passed the array to shortcode handler function i.e. $atts[0] which contains the strings which match shortcode regex.
Final output would look like this:
function customshortcode_function() {
ob_start();
return ob_get_clean();
}

That’s it!

Conclusion

So, get going and make the most of shortcodes for adding exclusive features and functions into your WordPress site-making it look and feel richer as compared to a range of websites prevalent over the internet.
Author Biography:
Samuel Dawson is a seamless professional in Designs2html. He is at senior level in this company and sharing his knowledge to beginners. He is impeccable in the conversion of psd to html5 with efficient results.