![[info]](https://www.insanejournal.com/img/userinfo.gif){kind=small}
[Paid] Multi-Level Tags in Sidebar
This code is almost identical to the tutorial found at the livejournal expressive community. That is because I blatantly stole it and adapted it slightly to work for Bloggish by changing the classes and one measly line of code.
As usual, you may change the stuff in green.
[Edit] Just when I thought I went and did something clever, I found out it's unecessary. Looks like the original code was written for Bloggish, too. Here it is.
In order for this code to display your tags properly, you will need to rename them using your delimiter (default is :). For example, I've used:
movies:anchorman
movies:the notebook
movies:stranger than fiction.
music:cas haley
music:andrew stein
music:jasonmraz:tv
music:open mic night
music:the white stripes
I personally like my inner links to have a different list style to differentiate them a bit more, so I used the following CSS for that:
As usual, you may change the stuff in green.
[Edit] Just when I thought I went and did something clever, I found out it's unecessary. Looks like the original code was written for Bloggish, too. Here it is.
function print_module_tags(string title) {
# Specify your delimiter. One character only -- extra chars get truncated.
var string delimiter = ":";
# Do you want to show the tag use counts?
var bool show_count = true;
# Specify the text to show just before the use count, if any
var string pre_count = "(";
# Specify the text to show just after the use count, if any
var string post_count = ")";
### Don't change below unless you know what you are doing!
var Page p = get_page();
var string list = "";
if (size $p->visible_tag_list() > 0) {
if ($delimiter->length() > 1) {
$delimiter = $delimiter->substr(0, 1);
}
var string[] closing_html;
var string[] prev_tags;
var int tag_list_pos = 0;
var string tier_code = "";
$closing_html[0] = "";
$prev_tags[0] = "";
foreach var TagDetail t ($p->visible_tag_list()) {
var string[] tags;
if ($t.name) {
var int array_counter = 0;
var string buffer = "";
foreach var string char ($t.name) {
if($char == $delimiter) {
$tags[$array_counter] = $buffer;
$array_counter = $array_counter + 1;
$buffer = "";
}
else {
$buffer = $buffer + $char;
}
}
$tags[$array_counter] = $buffer;
var int pos = 0;
foreach var string tier($tags) {
if (size $closing_html <= $pos) {
$closing_html[$pos] = "";
}
if (size $prev_tags <= $pos) {
$prev_tags[$pos] = "";
}
if (size $tags == ($pos + 1)) {
$tier_code = """<a href="$t.url">$tier</a>""";
if ($show_count) {
$tier_code = $tier_code + """ ${pre_count}${t.use_count}${post_count}"
}
}
else {
$tier_code = """$tier""";
}
if ($prev_tags[$pos] == "") {
$list = $list + """<ul class="module-list"><li class="module-list-item">$tier_code""";
$closing_html[$pos] = "</li></ul>";
}
elseif ($tags[$pos] != $prev_tags[$pos]) {
var int i = 0;
foreach var string html ($closing_html) {
if ($i > $pos) {
$list = $list + $closing_html[$i];
$closing_html[$i] = "";
}
$i++;
}
if ($closing_html[$pos] == "") {
$list = $list + """<ul class="module-list"><li class="module-list-item">$tier_code""";
$closing_html[$pos] = "</li></ul>";
}
else {
$list = $list + """</li><li class="module-list-item">$tier_code""";
}
}
else {
}
$pos++;
}
$prev_tags = $tags;
}
$tag_list_pos++;
}
var int i = 0;
var string remaining_html = "";
foreach var string html ($closing_html) {
if ($html != "") {
$remaining_html = $html + $remaining_html;
$closing_html[$i] = "";
}
$i++;
}
$list = $list + $remaining_html;
}
open_module("categories", $title, "");
print """$list""";
var string tags_url = $p.journal->base_url() + "/tag/";
close_module();
}
How to use this code
In order for this code to display your tags properly, you will need to rename them using your delimiter (default is :). For example, I've used:
movies:anchorman
movies:the notebook
movies:stranger than fiction.
music:cas haley
music:andrew stein
music:jasonmraz:tv
music:open mic night
music:the white stripes
Tweaking with CSS
I personally like my inner links to have a different list style to differentiate them a bit more, so I used the following CSS for that:
.module-categories ul ul li{
list-style-type:circle;
margin: 3px 0 1px 15px;
padding-left:0;
background:none;
}
