How To Customize WordPress Tag Cloud

by Dev Duff on May 10, 2009

Customize WordPress Tag Cloud

I wrote a wordpress tutorial about a month ago explaining the difference between ‘wordpress tags’ and ‘wordpress categories’, you can find the post here: WordPress Tags vs Categories. I also mentioned that ‘wordpress tags’ are ‘smart categories’ that help your blog gain higher ranking on Search Engines. To extend it further, this tutorial is about How to customize wordpress tag cloud.

Definition: WordPress Tag Cloud

WordPress tag cloud is nothing but a way to display your “smart categories” or what we call Tags. Tag Cloud helps in listing more tags within a small space and like any other widget, tag cloud widget can be inserted/used anywhere in your wordpress blog theme. Tag Cloud helps in displaying more categories/topics to your readers. Apart from the usual categories, your readers can enjoy different topics that are based on Tags.

XSitepro

Why Use Tag Cloud?

The answer is simple. Tags are powerful and display categorized relevant content. Ofcourse, you use categories on your blog, however, ranking higher on Search Engines for general terms (categories) like: Computers, Business, etc. may be a tough nut to crack. Whereas, if you use tags like: Discount Computers, Best Computers, Latest Computers, etc., you may have a fair chance that your blog will rank higher for these keywords.

How to Customize Tag Cloud?

That’s the question I would love to answer in this tutorial.

The WordPress Tags and Tag Cloud are controlled through a file called category-template.php which can be found at this location:

www.yourblog.com/wp-includes/category-template.php
(Please change ‘yourblog’ with your domain name).

You can open this file in your favorite text editor (notepad, dreamweaver, frontpage, etc.). Once you open up this file, press ctrl + F and search for ‘Display tag cloud’. You will find it by the middle of the file. This is the default code you will see:

function wp_tag_cloud( $args = '' ) {
$defaults = array(
'smallest' => 8, 'largest' => 22, 'unit' => 'pt', 'number' => 45,
'format' => 'flat', 'orderby' => 'name', 'order' => 'ASC',
'exclude' => '', 'include' => '', 'link' => 'view'
);

The above code shows the font size used in your tag cloud widget. So, if you are wondering, how to change tag cloud font size, this is the place where you can do that. The smallest font size for tags in your Tag Cloud is set to 8 pt by default and the maximum size is set to 22 pt. by default. The unit used for font size is ‘pt’. The last entity in the code line is the ‘number’ of tags to be displayed in your Tag Cloud. By default, it is set to display 45 tags in your Tag Cloud.

The wordpress Tag Cloud can be displayed in 3 different styles:

  1. flat: This is the default format setting. The flat value for the ‘format’ argument will separate tags with spaces.
  2. list: The list value for the ‘format’ argument will format the tags in a UL HTML list.
  3. array: The array value for the ‘format’ argument will return in PHP array type format.

If you wish to display your tags separated with spaces, you should choose the ‘flat’ format type. If you wish to display your tags like normal categories ‘one tag each line’, you should choose the ‘list’ format type. I’m not sure about the third format type ‘array’. May be it is used by hardcore programmers and wordpress blog designers. However, the first two formats are the best and will do the job.

Apart from the font size, unit for fonts, number of tags in Tag Cloud and format to be used in Tag Cloud, there are other options available to further customize your tag cloud. For eg., after the ‘format’ entity, you can see the ‘orderby’ entity which is set to ‘name’ by default. You can either display tags in your Tag Cloud ‘by name’ or display them ‘by count’ using the option ‘count’. This will bring up the tags used most, on the top. There are other things you can do, however, we will limit ourselves to the basic features, without getting into hardcore details.

This is the code that I am using on this blog:

function wp_tag_cloud( $args = '' ) {
$defaults = array(
'smallest' => 10, 'largest' => 10, 'unit' => 'pt', 'number' => 75,
'format' => 'list', 'orderby' => 'name', 'order' => 'ASC',
'exclude' => '', 'include' => '', 'link' => 'view'
);

This is the only code that you should tweak in order to display your wordpress tags with style, in your Tag Cloud widget. If you have any questions about customizing WordPress Tag Cloud, please post them below. I will try my best to help you. Hope you enjoyed this wordpress tutorial. This wordpress tutorial was written after taking help from the wordpress tutorial originally written by Maria Langer on her website Maria’s Guides – Digital Media by Maria Langer.

If you have any better tips to customize wordpress tag cloud, please feel free to post a comment below. You can explore other wordpress tutorials that may interest you or help you in one way or the other.
Thankyou for reading this article!

This post was written by...

Dev Duff – who has written 303 posts on Dev Duff.

Contact the author

{ 11 comments… read them below or add one }

Susan B.

Very nice WordPress Tag tutorial. The list order really makes for a more organized and cleaner look with this tag display method. Thanks for taking the time to share this WordPress tutorial with others.

Reply

Dev Duff

Hi Susan, glad to know that you enjoyed this wordpress tutorial, more tutorials will be posted from time to time. Keep visiting us in your free time. Cheers!
Dev

Reply

Mike

Thanks for this clear well-written tutorial. It helped significantly and saved me a lot of time trying to find out where all the details were stored.

Keep up the good work!

Reply

Ed

Is there a way to have the tag cloud justified, instead of left-aligned?

Reply

Ajit

Thank you very much for this article. Really it helped me lot.

Reply

Jubbling

Perfect! I didn’t want another plugin and this did the trick.

Reply

emily

Thanks for this tutorial.
I have a question, maybe you can help.
I’m using 4 tags in tag cloud to create sort of sub-menu.
I used ‘include=32,58,64,96′ to include only the 4 tags.
Now, I would like the tags to appear ordered not by name or count but by tag_ID.

Do you know how to do it ?

Thanks in advance for any answer you might give.

Reply

Dev Duff

Hello Emily,

I think you will have to write a function of your own and then perhaps the task can be accomplished. According to Wordpress Docs (Docs.wordpress.org), You can arrange Tag Cloud order by name or count only and in Ascending, Descending or Random orders only. To do what you are trying to do, you will have to write a function.
Sorry, I couldn’t be of much help.

Regards,
Dev.

Reply

yunieski

Thanks for this tutorial, it helped me a lot, but i have a question, i am using wordpressMU for developing a blogs platform in my university, and i wanna get tags from all blogs created instead from the primary blog, how could i make this feature???. I need to know how to extract from the DB what i am going to show on the tags cloud.

Regards,
another wordpress user.

Reply

Anson

Exactly what I was looking for! One addition though. I changed my tag cloud to order by “count” instead of “name” and it appeared in order from smallest to largest.

In order to order it from largest to smallest I had to change
‘order’ => ‘ASC’, into ‘order => ‘DESC’,

Thanks again!

Reply

David

Hi
Just installed a tag cloud plugin for wp, continued to configure tag cloud options, and that was as far as I got. How do we actualy get it on page?I am currently preparing some keyword pages and want to use this as a navigation tool. my theme has been modified.
hope you can help
David Walker

Reply

Leave a Comment

Previous post:

Next post: