Shortcodes can be used to increase the functionality of WordPress, whilst saving time on having to manually write code every time you want a specific function to be applied to one of your posts.
I use shortcodes within my blog to show accordian boxes, featured images, tables, custom tweet buttons and more. Considering that I can do all this without having to type any code, it saves me a LOT of time and energy.
Creating a Simple Shortcode
Creating your very own shortcode doesn’t take long at all. You don’t even need a huge understanding of PHP to create simple shortcodes, so I’ve put together a few simple steps on how to build a simple shortcode all by yourself…
Creating an RSS Subscription Shortcode
This is a pretty basic shortcode but it can come in really handy for adding in a link to subscribe to your blog’s RSS feed within your blog posts.
1. Creating the Function in WordPress
The first thing that you need to do is create the function for the shortcode within your functions.php file. On a new line, add the following code:
function rss_subscribe_link() {
return 'Enjoy what you're reading? <a href="http://findmyblogway.com/feed/">Subscribe to our RSS feed here now</a>.';
}
2. Hooking into WordPress
Now that the function has been created, it’s time to hook into WordPress in order to associate the function with a shortcode. Here’s the code that needs to be added to the functions.php file:
add_shortcode('rss-subscribe', 'rss_subscribe_link');
3. Calling the Shortcode in WordPress
The last thing to do is to call the shortcode in WordPress. This is done within the text editor of your post/page. For the above shortcode, we would add the following shortcode:
[rss-subscribe]
And that’s it! As I said, this is a pretty basic example of a shortcode but there are tons of possibilities to create more advanced functions. Having said this, I find that most of the shortcodes that I regularly use are some of the most basic ones.
Creating a More Advanced Shortcode
If you’re looking to create a slightly more advanced shortcode then there are a few extra things to consider.
Creating a Custom Button Shortcode
Using some custom attributes, you can create a sexy little button with some custom text on it that you can use for a whole host of purposes.
1. Building the Function
function adding_custom_button($atts, $content = null) {
extract(shortcode_atts(array(
'link' => '#'
), $atts));
return '<div class="button"><a href="'.$link.'">'.$content.'</a></div>';
}
The above function adds in a div with the ‘button’ class that can be styled up to show a nice looking button. Alongside this, there is the custom ‘link’ attribute that can be used to link the button to wherever you want.
Finally, the text for the button can be added using the ‘content’ variable which, along with the link attribute, can be specified when calling the shortcode.
2. Hooking into WordPress
Like with the simple shortcode example, we need to hook into WordPress and associate the function we created with a shortcode that can be used.
add_shortcode('custom-button', 'adding_custom_button');
3. Calling the Shortcode in WordPress
To now call the shortcode in WordPress using our custom attributes, something along the lines of the following can be used:
[custom-button link="http://findmyblogway.com"]Download Now[/custom-button]
The above example would have ‘Download Now’ as the button text and be hyperlinked to ‘http://findmyblogway.com’.
You can replace these attributes with whatever you like, and you could even go as far to add an extra variable within the function that changes the colour of the button (this could be done by changing the div class via a variable).