[paid] Tag Cloud

Aug 17, 2007 18:50

I really struggled with this tutorial. I was never any good at writing S2 code, I'm just good at adapting it for my own purposes! Anyway, I finally came up with a way to display a tag cloud in your sidebar, thanks in part to the tutorial in s2smoothsailing. You can have many variations of this, so I will list them here as well.

Basic Code Tags as a list with varying font sizes (keeps the bullet image).

function print_module_tags(string title) {

var int minSize = 10;   # minimum size of tag links, in pixels

var int maxSize = 24;   # maximum size of tag links, in pixels

var Page p = get_page();

var TagDetail[] tags = $p->visible_tag_list();

if (size($tags) < 1) { return; }

var int most_count = 1;

open_module("categories", $title, "");

foreach var TagDetail tag ($tags) {

if ($tag.use_count > $most_count) { $most_count = $tag.use_count; }

}

var string[] links = [];

foreach var TagDetail tag ($tags) {

var string uses = get_plural_phrase($tag.use_count, "text_tag_uses");

var string security = $tag.visibility;

var int tagtextsize = $minSize;

if ($tag.use_count > 1) {

$tagtextsize = (($maxSize-$minSize)*$tag.use_count)/$most_count + $minSize;

}

$links[size $links] = """ $tag.name""";

}

print_module_list($links);

close_module();

}

Modifications

» Display the tags inline (keeps the bullet images)
Add the following code to your custom CSS:

.module-categories li{
float:left;
}

» Display inline without bullets
Add the following code to your custom CSS:

.module-categories li{
float:left;
background:none;
margin:0;
}

» Display as list in a scrollbox
Add the following to your custom CSS:

.module-categories ul{
height:150px;
overflow:auto;
}

tutorial:tags, tags, tutorial, modules:tags, tutorial:modules, modules, tag cloud

Previous post Next post
Up