WordPress Guy

Have you noticed that many blogs have a tag cloud in their sidebars? however, not many have a tag cloud page. Why a tag cloud page you may ask! Well… many reasons: de-cluttering your sidebar, adding interactivity to your blog, … Or maybe you have so many tags that they don’t fit in your regular tag cloud widget.

So that’s what this tutorial is about: creating a tag cloud page.

Before we start

Before we start, you need to be running WordPress version 2.3 or later, and of course have a bunch of posts with tags, otherwise you may end up with an empty tag cloud.

Creating the page template

First, we need to create a custom page template. A page template is nothing more than a PHP file with a special commented code at the beginning of the file.

Go ahead an create a new php file and name it “tagcloud.php” or whatever you want. Now put the following at the beginning of it:

<?php
/*
Template Name: Tag Cloud
*/
?>

With this we’re telling WordPress that our tagcloud.php file is a page template and it’s name is “Tag Cloud”.

The basic structure

Now let’s add the basic page structure, header, sidebar and footer. Of course, this depends on the theme you’re using. I’m just going to assume we’re using the Kubrick theme structure for this tutorial. I recommend you open the page.php file of your theme and try to replicate it. The resulting file might look something like this:

<?php
/*
Template Name: Tag Cloud
*/
?>
 
<?php get_header(); ?>
 
    <div id="content" class="narrowcolumn">
 
    </div>
 
<?php get_sidebar(); ?>
 
<?php get_footer(); ?>

That would print an empty page because we haven’t inserted the template tag yet.

The template tag

Now we need to put in the tag cloud template tag: wp_tag_cloud(), which will print the tag cloud. You can find more information on the wp_tag_cloud() template tag in the codex.

Okay, let’s add the template tag:

<?php
/*
Template Name: Tag Cloud
*/
?>
 
<?php get_header(); ?>
 
    <div id="content" class="narrowcolumn">
 
        <div class="tag_cloud">
            <?php wp_tag_cloud('number=0'); ?>
        </div>
 
    </div>
 
<?php get_sidebar(); ?>
 
<?php get_footer(); ?>

Notice that we entered “number=0” parameter, this is because, by default, the wp_tag_cloud() template tag only prints the 45 most used tags, and we want to display them all instead.

Also, we’ve placed the template tag inside a div with a class of “tag_cloud” in case we need to style it later with some CSS.

We’re done with the PHP part, now save your file and upload it to your theme directory (wp-content/themes/your_theme_name).

Creating a new page in WordPress

All we need to do now is create the page in WordPress. To do this, you just have to follow these steps:

1. Go to the Write » Page section of the admin panel.
2. Type a descriptive title for the page in the Title field.
3. Locate the Page Template panel, open it if it’s closed, and choose “Tag Cloud” from the drop-down menu.
4. Hit the Publish button.

And we’re done. Feel free to post your thoughts and questions in the Comments section.