How to use tagging in WordPress 2.3

Built-in native tagging support is a great new feature of WordPress 2.3. It is worth updating your WordPress installation for this feature alone.

There’s little information, however, on how to implement tagging in your WordPress blog, especially if you created your own templates or rely on a template created by a third-party designer.

To save others the time I spent figuring it out, here’s a short tutorial on how to use the new WordPress 2.3 natural tagging feature.

Working with tagging after the update

There are a couple of things you must do to enable tagging after you have updated your blog to version 2.3.

Convert categories to tags

Since tags are more precise than categories, I recommend that you convert your categories to tags. Warning: Once you convert categories to tags, you can’t get the categories back.

WordPress provides a one-click conversion: From the Dashboard, click on “Manage”, then “Categories”. Find the “category to tag converter” link below the list of your categories and click on it. Ignore the checkboxes on the next screen and continue until all your categories are converted to tags.

Edit tags

Category terms may not make good tags, so you may have to edit the tags. WordPress 2.3 doesn’t provide a tag editing mechanism similar to the Category editing form so you have two options: Edit the database tables themselves (not recommended!) or editing each individual post (impossible if you have many, many posts). I sense a plug-in opportunity here!

How to tag each post

You enter one or more tags for each post in a new field added to the “Write Post” form. It’s below the text entry field.

Tag terms may be one word or multiple words, separated by commas. I’ll leave it to you to formulate a tagging strategy, but here’s a suggestion: Choose tags that will look good on Technorati.

How to add a tag list to each post

Two new template tags were added in WordPress 2.3. I’ll cover the tagging list template tag here (and the tag cloud template tag below).

A new “the_tags” template tag allows you to insert a list of tags anywhere you want in your post template. Most people will place the tag list at the bottom of each post, inside The Loop (look at the bottom of this post).

The template tag has three arguments:

< ?php the_tags('before', 'separator', 'after'); ?>


before

Text to use before the list of tags for this post, for example, “Tags:”, “Tags for this post:”, etc.

separator

The character(s) used to separate the tags, for example, a coma “,”, or a dash “-”.

after

Text to use after the list of tags, for example a line break “
“, or nothing “”.

Here’s what my the_tags looks like:

< ?php the_tags('Tags: ',', '); ?>


How to add a tag cloud to your sidebar

The second new WordPress 2.3 template tag is “wp_tag_cloud“.

This one has more arguments, and requires a little trial and error to make it look right.

< ?php wp_tag_cloud('smallest=8&largest=22...'); ?>


smallest

A number representing the smallest font size (for the least used tag).

largest

A number representing the largest font size (for the most used tag).

unit

The font-size unit to be used with smallest and largest, for example, “px”, “pt”, “em”, or “in”.

number

The maximum number of tags to display. Use zero or omit the argument to display all tags. (Presumably “20″ would display the twenty most popular tags!)

format

Text describing the display format:

• “flat” (default) results is a simple unformatted list as you would expect in a tag cloud
• “list” creates an unordered list with a class of “wp-tag-cloud”
• “array” returns the tag list in an array

order, order by, exclude, include

The remaining arguments are not as interesting and are explained in the documentation.

Here’s the values I used to create the tag cloud in the sidebar on the left:

<div class="tagcloud">
< ?php wp_tag_cloud('smallest=8&largest=22&unit=pt'); ?>
<div>


I created a new style, “tagcloud“, and applied it to the div enclosing the tag cloud. The style centers the list and colors the anchor tags. Here’s the style:

.tagcloud {
line-height:1.1;
text-align:center;
}
.tagcloud a {
color: #444444;
text-decoration: none;
}
.tagcloud a:hover {
color: #aa0000;
text-decoration: underline;
}


Native tagging is a great addition to a WordPress blogger’s tool chest. I encourage everyone to use it.