Creating Shortcodes in WordPress – Beginner Tip

Hey Guys,

Well, there are times when you would need this. The need could be as simple as adding two numbers but ShortCodes offers so much flexibility to WordPress that it is right of every blogger to know how to create a shortcode.

I know, if you are like me the first thing you will do is to search Google for it and you will be taken to wordpress codex. So right at the end of this post there is a link to official ShortCode API that WordPress provides. The purpose of this post is to make is as simple as it can get.

Let get back to the point. I will be creating a short code to add 2 numbers and we will call our new short code function as my_shortcode_adder, and shortcode name as addnumbers I know its not very intuitive but will do the job for us 🙂

First thing that you will need to do is to look for

The Theme’s functions.php file

The most important part of our shortcode creation is the file called functions.php (found in /wp-content/themes/THEME_NAME/functions.php) and it will always be there under your current theme folder. Lets check our function that we will place (append) to functions.php file as shown below

[geshi  nums=”0″]

So we are using a couple of functions above. $atts defines the input that is in form of an array , To set default values for missing attributes and to also eliminate any attributes that are not known or recognized by your shortcode, the API provides a shortcode_atts() function. As you can see above that we are setting defaults for our attributes number1 and number2 to O

The most important thing however is that you should not be echo’ing  your output in your shortcode function, you should always return it.

Registering Shortcode

Just defining the above function is not enough. You should also get it registered with WordPress. This is done by using function add_shortcode  as shown below

[geshi  nums=”0″]

Above can go straight after the function declaration.

Using Shortcode

Now that our short is good to go, thus we can now use out newly created shortcode in either our posts or on our WordPress pages as shown below

While creating/editing a post here is how you can use out shortcode

[geshi  nums=”0″]

So you see its that easy. The above will print 30. This actually opens a lot or other ideas that you can make use of. It will be you head that defines how you use it though. I am using it to create coupons, ads codes, outputting images etc etc.

This post just reflects on bare minimum to create a simplest possible shortcode. If you find any problem with the above code or this post can be improved in any way, please leave your comments.

For advance API read please do read official ShortCode API that can be found at the link provided below

Resources

The official shortcode API page on WordPress.org

http://codex.wordpress.org/Shortcode_API

I hope this will be helpful to you.

Cheers,