Phydeaux3 has written an extensive 3-part how-to for a version of the del.icio.us category method that creates a single, hidden post in the archives of your blog, and uses javascript to build a dynamic category list within that single post when you link there from the special sidebar menu. Very cool.
- Part 1 covers the creation of the special dynamic post, and of a sidebar menu that will link to that post.
- Part 2 deals with customising the link field for the addition of tags, as well as the construction of a one-click post-to-del.icious link that can remember your tags.
- Part 3 is about hiding the category post on the archive page, so that it is only visible from the sidebar, as well as formatting the display of information on the category post.
]^23003]^23900]navy],](](]]]black],]3]1]2]3]1]1]4]1]2]3]1]1],](](]^23FFFff])])]Freshblog]Blogger^20Hacks^2C^20Categories^2C^20Tips^20^26^20Tricks],](],](](]^23900](](](]^23666](](](]^23900](],](](]75]20],](](]^23FFF])])]^23900]1.5]15],](](]^23999])])]^23900]^23CCC])])]^23900]30]^23003]^23003],](](]^23333](],](]^23003]^23039]^2306C],](](]^23CCC])])],](](]^23EEE])])],](](]^23CCC])])],](]^23006]^23666]15]3]25]20]^23003],](](],](],](](],](]^23003](](](],](](](],]black](](](],](](]black](](](](](],]^2336F]^23003](],](]Posted^20at^20^24TIME^20by^20^24AUTH.]20],](](]^23900])])]^23CCC])])]^23666]30]black]black],](](]^23333](],](]^23333]^23039]^2306C]Freshblog]]]Home]^24HOME]First^20Page]Email]^24EMAIL]Mail^20me^21]RSS]^24RSS]RSS^20Feed]Comments^20Feed]]Comment^20Feed^20]Archive]]]^24ARCHIVE]^20]]Freshtags]]]Horm])blog.horm.org]Hallucinations^20Of^20Reabsorbed^20Mind]Phorm])p.horm.org]Another^20Phormation]Etc]]]^3Cimg^20src^3D^22)psyc.horm.org/barimg/bar_psycho.png^22^20width^3D^2280^22^20height^3D^2215^22^20alt^3D^22PsycHo^3A^20Free^20Template^20Generator^22^20style^3D^22border^3A^200px^20solid^20black^22^20/^3E]^24PSYCHO]PsycHo^3A^20Free^20Template^20Generator]^3Cimg^20src^3D^22)psyc.horm.org/barimg/bar_firefox.png^22^20width^3D^2280^22^20height^3D^2215^22^20alt^3D^22Get^20FireFox^21^22^20style^3D^22border^3A^200px^20solid^20black^22^20/^3E])www.mozilla.org/products/firefox/]Get^20Firefox^21]^3Cimg^20src^3D^22)psyc.horm.org/barimg/bar_xhtml.png^22^20width^3D^2280^22^20height^3D^2215^22^20alt^3D^22XHTML^20Validator^22^20style^3D^22border^3A^200px^20solid^20black^22^20/^3E])validator.w3.org/check/referer]XHTML^20Validator^26^2361470^3BPsycHo}){kind=small}
It's worth it though; the end result is pretty and slick-looking. I like the "supertags", whereby readers can elect to point the current tags at a range of services. And the simulation of multiple words (by adding/removing _ on the fly) is done nicely. The highlight for me was the how phydeaux3 implemented the tag cloud ... I won't ruin the surprise for you.
Interested readers should also have a look at Singpolyma's implementation too: it's a similar approach of pointing the delicious categories at one of your blog pages and munging the matching posts onto the magic page, search engine style.
I probably should point out that the "supertags" Greg mentions aren't covered in the how-to. They really don't have anything to do with the categorization method. Just something I threw together quickly on an idea.
Also I haven't really added how to precisely implement the "tag cloud" yet.
Pretty trivial, I just haven't written it up yet.
Thanks again.
say greg, how about you start working on making the tags look good? using css, its kinda limited. it'd be nice if the 'flat' style appeared below one another, instead of coming up right next to each other!
good stuff phydeaux3. keep up the good work!
Gee, thanks, adi! It should be plain that I'm not a graphic artiste - I'm not even a proper coder. But I think you might be selling short what can be done with css. Most of the ways html lets you display info are presented, and the rest just comes down to styling.
For example, I read your request above about flat lists as "an unordered list, but without any bullets". Maybe a bit like on my homepage?
You could try changing your your listTag call from "flat" to "list" and sticking this in your template header:
<style>
li.showtag
{
line-height: 130%;
margin-top: 1em;
list-style: none;
margin-left: -1em;
}
</style>
(Change showtag to showtitle to do this to post titles.)
Or - to be totally brazen - find something you like and, um, get inspired.
For example, phydeaux3's .sidebox style looks very nice. Plenty of inspiration there.
So, if you come up with something you like, feel free to post it back here and we can all enjoy it.