Multi-Level Tags in Sidebar

[murklinstest]

This is code to display your tags in a sidebar box. By naming your tags using a delimiter, for example animals:cats:tabbies or animals:cats:siamese, where the colon is the delimiter, you can display a heirarchical list of tags. If you feel your tags list will take up too much space in the sidebar, there is example styling provided to limit the

Comments

[k0rdell]

Thank you so much for this code. It works brilliantly.

[murklinstest]

Great! I love to hear success stories.

[forceflow2]

I'd love to use this code and tried to copy and paste it into my layout, but I am getting this error:
Compile error: line 82, column 14: Unknown function Page::visible_tag_list()
And this is my line 82 (although that's not overly helpful, I know. But where is visible_tag_list() specified at? Is it just a standard LJ function?)
82: if (size $p->visible_tag_list() > 0)

[afuna]

The visible_tag_list() is a new function that was recently added to the Core layer.

Sometimes, older layers that were compiled before tags went live can't recognize the newer functions that have been added in. Try recompiling your theme layer without the modifications, and after that retry putting in the modifications from this tutorial.

Also, if you're using your own layout layer (for instance, some people who started using Flexible Squares from back when it won the contest but before it went live system wide c&ped the entire layout layer), recompile that too, before adding in the modifications that have to do with tags.

[forceflow2]

Excellent, it's working now. Thank you very much!!!

[bno]

Fantastic, good work :D

[murklinstest]

Thanks, glad you like it.

[aerithfreak]

Just a question. Is there a way to set it up so that only sub-levels have the padding on the left, as I would like the top-levels of the list to be aligned to the left of the sidebar so it doesn't look so out of place above my Page Summary.

Example: http://aerithfreak.livejournal.com/#tag

[murklinstest]

You should be able to get that with the following css, where the red code is entirely new and the blue code has been altered from the original:

li.tagItem {padding-left: 0px; list-style: none;}
li.tagItem ul li {padding-left: 15px; list-style: none;}

[aerithfreak]

Yup that worked. Thanks.

[boutondor]

I feel really stupid because I must be missing something way obvious since no one seems to have that problem but my tags don't look like that screen cap at all. It's just all of my tags listed one after the other in alphabetical order. How can I make it like yours?

[murklinstest]

Looking at your layout, what you need to do is add some delimiters to your tags. So if you post a lot of icons for different fandoms, you might want to tag the posts that have icons for Veronica Mars as "icons:veronica mars" while the ones specific to Lost could be tagged with "icons:lost". Posts that include icons from many different fandoms might get several tags, one for each fandom (icons:lost, icons:veronica mars, icons:farscape). Or, you could choose to use a single multi-purpose tag like "icons:multi-fandom". That's up to you.

The result of using the colon in your tags is a nested list, which should look like this:

icons
farscape
lost
veronica mars

[afuna]

In a situation such as this, where the tag categories are mixed up a lot, would it be better to use the layout-controlled tagbundles instead of tagname controlled ones? (Ah for official LJ-implemented tag bundles...)

[murklinstest]

Also an excellent idea! Now where's that code again?

(Some explanation for boutondor: This community uses the bundle approach, which you can see in its sidebar. You start off by picking some overall bundle names, in the comm's case, "By Topic", "By Account Type", "For Official Use Only" and "Special". Then in some theme layer code you specifically assign certain tags to the different bundles. The code will automatically generates a two-tiered list, with tags associated with each bundle geting listed under the appropriate bundle name. The benefits are that you don't need to change any tag names -- your tag names can remain quite simple. Also, you can assign a single tag to more than one bundle. The downside is that whenever you want to add a tag to a bundle, you need to make a very minor tweak to your theme layer code. Also, it really only works in a two-level list situation -- you couldn't have a more nested list.)