WordPress Quick Tips #3:Adding a Shortcode to a Sidebar Widget

Are you thinking of using a plugin that uses shortcodes? (Shortcodes are tags in square brackets like [az-index id=”1″ escape=”true”] that some plugins use to embed content into posts and pages.) Do you want to be able to use a shortcode in your blog’s sidebar instead of your post or page?

Well, if the answer to both those questions is “Yes” then you have come to the right place!

Normally, shortcodes are ignored if you try putting them in a sidebar widget — all that’s displayed is the shortcode itself. But there is a one-line tweak you can add to your theme that will enable you to put any shortcode you like in a sidebar widget. For example, one AZIndex user recently wanted to display an index generated by the plugin in his blog’s sidebar. These are the steps he followed:

Login to your blog’s administration pages and go to the Theme Editor — i.e. select Design >> Theme Editor from the admin menu.
Look in the list of Template Files on the right of the page for one called Theme Functions or functions.php and click on it to load it into the editor.
Find a place between the <?php and ?> tags which is not in the middle one of the functions that may already be in the file (the very top or bottom of the file are both good places) and add the following line:
add_filter('widget_text', 'do_shortcode');
Click on the Update File button to save the modified template.

That’s all you need to do. Now any shortcodes you add to a sidebar widget will be correctly processed by the plugin they belong to. The easiest way to test this is as follows:

Go to Design >> Widgets using the administration menu.
Find the Text widget in the list on the left, and click its Add button.
Click on the new widget’s Edit link, and enter a title for the widget and then add the shortcode below it.
Click the Change button, then click the Save Changes button (easy to forget) and then go to the front page of your blog to see your new shortcode-enabled widget.

(Note: your theme must support widgets for the new text widget to show up. If it doesn’t then you will have to “widgetize” your theme or find another theme that does support widgets.)

So if you have been itching to use AZIndex to put an index of posts in your sidebar (just not too big, I hope) then now you know how to do it! Of course, this tip will work for any plugin that uses shortcodes.

21 thoughts on “WordPress Quick Tips #3:Adding a Shortcode to a Sidebar Widget”

Bullion October 9, 2008 at 5:01 am

Great tip on adding shortcodes to the text widget. To use your shortcodes outside of posts, pages, and the text widget, you could always call your shortcode function directly like this:

$text = yourShortCodeFunction(‘[your shortcode tag here]’);
echo $text;

The above code will allow you to use wordpress shortcodes anywhere in your blog. Keep up the good work.

I really like how you can preview your comment before submitting, is that a wordpress plugin?

Reply ↓

Andres October 19, 2008 at 9:06 pm

Hi.
I’ve installed your plugin and am using it at http://no.ticiero.com/noccionario/

I’d like to add the az index at the bottom of all posts within a particular category. Is there any way to add this into the php for that template rather than add it manually to each post in that category?

thanks for hte great plugin.

Andres

Reply ↓

JenniferB November 7, 2008 at 9:05 pm

Hi,

I have tried this tip in order to use it in combination with a new widget called Widget Changer but it is not working as you can see in the sidebar of this post:
http://jenniferbrinckmann.com/journal/homemade-italian-vinegar/
Can you point me in the right direction, please?

Any help would be greatly appreciated.

Best regards,

Jennifer

Reply ↓

Kisu @ ClassroomTeacher November 16, 2008 at 1:20 am

Hi English Mike,

Tried the tip but couldn’t get it to work on our site. (Trying to use it with posting a single pic with the NextGEN gallery short code. Something like, [singlepic=id,width,height,web20,center] where the variables are numbers. The code works fine in a post, but doesn’t get filtered in the widget, even with your little hack.

Still, it was a nice try. Thanks for the tip. I might try Bullion’s tip and simply use a PHP Exec plugin to run php in the widgets. Cheers, Kisu

Reply ↓

Pingback: How to: Add shortcodes in sidebar Widgets

neden para icat December 26, 2008 at 3:26 pm

thanks for this info…

Reply ↓

Design_dolphin January 12, 2009 at 6:39 am

@Bullion unfortunately couldn’t get your example to work :/. Don’t know what I did wrong. The following code worked for me in 2.7 for placing az-indexes in template files.

Within php tags:

php echo do_shortcode(‘[az-index id=”number”]’);

Where “number” is the id of the index. So for example:

php echo do_shortcode(‘[az-index id=”1″]’);

Reply ↓

Pingback: Mastering WordPress Shortcodes | How2Pc

Pingback: Mess like the Best: Wordpress Shortcodes: | Orange Market

Pingback: Mastering WordPress Shortcodes - HTD-34

osu February 13, 2009 at 7:53 am

Hi,

I’m trying to insert a list of subpages into my sidebar by placing a shortcode in a text widget, however, it’s not working.

Could you take a look at my code and let me know if there’s anything glaringly obvious?

// Create shortcode function for Showreel page
function subReel() {
if(is_page(15)) {
wp_list_pages(‘title_li=&child_of=15’);
}
}

// Create shortcode
add_shortcode(‘subpagesReel’, ‘subReel’);

// allow shortcodes in widgets
add_filter(‘widget_text’, ‘do_shortcode’);

Thanks,

osu

Reply ↓

English Mike Post authorFebruary 13, 2009 at 7:52 pm

Hi, I don’t think you can use “is_page()” with a page number. In any case, you don’t really need it, since you’re hardcoding the value in the function — if it’s a page, it’s always a page 🙂

Anyway, if you take that test out, the shortcode should work fine.

Reply ↓

Jasmine February 18, 2009 at 5:56 pm

Hi,
I am using the below shortcode, however it does not output where I place the shortcode, it is placing the story right at the beginning of the post content. Is there something wrong with my code?

function shortcode_id() {
the_ID();
}
add_shortcode(‘id’, ‘shortcode_id’);

Thanks
Jasmine

Reply ↓

English Mike Post authorFebruary 19, 2009 at 12:36 am
Hi Jasmine, for the output to appear in the correct place you have to return the output from the function. “the_ID()” has an echo statement inside it, so your shortcode content is output (as you saw) but in the wrong place.

You need to do this:
```
function shortcode_id() {
   $output = get_the_ID();
   return $output;
}
```
That should do it!
Reply ↓
Michelle November 5, 2009 at 3:40 pm

I had the same problem but I was using echo $output; Changing it to return $output; fixed the placement. Thank you!
-Michelle

Reply ↓

Pingback: Mastering WordPress Shortcodes | Bookmarks

RRG June 5, 2009 at 2:20 pm

shortcode does not work in widgets as listed above. I’ve added the code to functions.php and nothing. Maybe it just won’t work for nextgen’s tag system to call the [ tagcloud ] witch is worthless anyway.

Reply ↓