How to Create Shortcode in WordPress

A SIMPLE SHORTCODE

The shortcode API works very simply: first you need to create a callback function that will run anytime the shortcode is used; then you need to tie that function to a specific shortcode making it ready for use. The code is frequently placed in the functions.php file, but if you plan on having a lot of shortcodes, it makes sense to create a separate file and include that file in your functions.php file.

In our first example we want to create a shortcode that will create some lorem ipsum every time we type [lorem] into the editor. First we need to create the callback function that will return the lorem ipsum (in shortcodes we don’t echo anything, everything is returned):

Step-1 : Register Shortcode 

W need to add this shortcode to WordPress using the add_shortcode function in either our functions.php file or a file that’s being included in it

<?php 
/* Register Shortcode */
add_shortcode('lorem', 'lorem_function');
?>

Step-2 : Define Your Custom Function:

Custom function is a callback function where you can write any thing what you want to show

<?php
/* Here define your custom function where write content */
function lorem_function() {
     return 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec nec nulla vitae lacus mattis volutpat eu at sapien. Nunc interdum congue libero, quis laoreet elit sagittis ut. Pellentesque lacus erat, dictum condimentum pharetra vel, malesuada volutpat risus. Nunc sit amet risus dolor. Etiam posuere tellus nisl. Integer lorem ligula, tempor eu laoreet ac, eleifend quis diam. Proin cursus, nibh eu vehicula varius, lacus elit eleifend elit, eget commodo ante felis at neque. Integer sit amet justo sed elit porta convallis a at metus. Suspendisse molestie turpis pulvinar nisl tincidunt quis fringilla enim lobortis. Curabitur placerat quam ac sem venenatis blandit. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nullam sed ligula nisl. Nam ullamcorper elit id magna hendrerit sit amet dignissim elit sodales. Aenean accumsan consectetur rutrum.';
}
?>

Step-3: Use Shortcode in WordPress

We need use WordPress built function do_shortcode  to echo content of shortcode in your php files.

/* Here are few ways to call shortcode */

// In WP Content editor or Widget area
[lorem] 

// In your functions.php or other php file
<?php echo do_shortcode('[lorem]')?>

That is all it takes to create a simple shortcode in WordPress.

 

 

ADDING PARAMETERS

we’ll create a shortcode to insert an image like this:

[mypicture width="500" height="500"]

Next we need to create the callback function like below:

function shortcode_callback_function($atts) {
   extract(shortcode_atts(array(
      'width' => 400,
      'height'=> 200, 
), $atts)); 
return '<img src="http://dummysite.com/'. $width . '/'. $height . '" />'; 
}

Finally the function returns the value we want, in this case the HTML code for our image combined with the width and height variables.
The only thing left to do is register this shortcode:

<?php 
/* Register your shortcode like below */
add_shortcode('mypicture', 'shortcode_callback_function');
?>

 

Published
Categorized as WordPress

By Ashutosh Pratap

I am software developer by profession and doing work and research in field of Computer programmings like PHP, WordPress, Magento, jQuery, Google APIs and many more web languages. Apart from this I write blogs on programming languages like PHP, Javascript, WordPress etc. I am also individual and independent Freelancer so you can hire me for your web work.

Leave a comment

Your email address will not be published. Required fields are marked *