Results 1 to 3 of 3
  1. #1
    Fatic's Avatar
    Fatic is offline Freshman
    Join Date
    Jun 2008
    Location
    Indonesia
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Feedback Score
    0

    Post 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/>
    <blse/>
    <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.)

  2. #2
    himoacs's Avatar
    himoacs is offline Master
    Join Date
    May 2008
    Posts
    8,488
    Thanks
    142
    Thanked 346 Times in 289 Posts
    Feedback Score
    6 (100%)

    Default

    do you have a blog where you have tried this before? I really wanna see how this thing works and looks at the end.

  3. #3
    Fatic's Avatar
    Fatic is offline Freshman
    Join Date
    Jun 2008
    Location
    Indonesia
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Feedback Score
    0

    Default

    yes i have a blog, and i was try on my blog. check this this really work. or check more detail on this blog

Similar Threads

  1. Adding a Drop Shadow to an Image
    By Amirmullick3 in forum Web Development - Programming & Coding
    Replies: 3
    Last Post: 03-11-2010, 02:21 PM
  2. Animated Drop Down Navigation Menu
    By JavaScriptBank in forum JavaScript & AJAX
    Replies: 0
    Last Post: 03-08-2010, 06:47 PM
  3. Need Directory DB Structure And Categories
    By Amirmullick3 in forum Freebies
    Replies: 3
    Last Post: 07-03-2008, 09:15 AM

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •