Results 1 to 3 of 3
-
08-06-2008, 03:32 AM #1
Drop-down labels (categories) for blogger
As you know, labels are Blogger's way of supporting categories. But, Blogger supports it only as a list of links unlike Archives for which it supports other options such as Drop-down menu, Hierarchy (Expand/collapse). I thought there's a possibility of a hack right there - Drop-down menu for labels. It was a breeze to implement it after spending a little bit of time with the template.
Even though Blogger has opened up template editing, they are just teaching us the ABCD of it now. So, if you click on Edit HTML, it shows only the condensed form of the template. But, there's an option at the top right called "Expand Widget Templates". If you click it, you will see the template expanded to more hacker-friendly form. Blogger's help page for Widgets just says "coming soon" but what good is a hacker if he cannot understand raw code without help pages
.
Assuming that you have already created labels and added a page element for labels in your sidebar, here's what you need to do to convert the list of labels to drop-down menu like the one I have in my sidebar. First download the expanded template to your hard disk, make a copy of it and find the following section of code in the template.
<b:widget id='Label1' locked='false' title='Labels' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<ul>
<b:loop values='data:labels' var='label'>
<li>
<b:if cond='data:blog.url == data:label.url'>
<data:label.name/>
<b
lse/>
<a expr:href='data:label.url'><data:label.name/></a>
</b:if>
(<data:label.count/>)
</li>
</b:loop>
</ul>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>
Replace the portion above in red with the following code snippet.
<br />
<select onchange='location=this.options[this.selectedIndex].value;'>
<option>Select a label</option>
<b:loop values='data:labels' var='label'>
<option expr:value='data:label.url'><data:label.name/>
(<data:label.count/>)
</option>
</b:loop>
</select>
Then upload the modified template to Blogger, you got drop-down labels!
(I also checked whether Expand/collapse option will work with labels but Blogger doesn't seem to provide the list of posts for every label, instead only depends on the search facility. I will explore the possibility of this when I get more time.)
-
08-06-2008, 08:55 AM #2
do you have a blog where you have tried this before? I really wanna see how this thing works and looks at the end.
-
08-07-2008, 12:44 AM #3
Similar Threads
-
Adding a Drop Shadow to an Image
By Amirmullick3 in forum Web Development - Programming & CodingReplies: 3Last Post: 03-11-2010, 02:21 PM -
Animated Drop Down Navigation Menu
By JavaScriptBank in forum JavaScript & AJAXReplies: 0Last Post: 03-08-2010, 06:47 PM -
Need Directory DB Structure And Categories
By Amirmullick3 in forum FreebiesReplies: 3Last Post: 07-03-2008, 09:15 AM




Reply With Quote

