Sunday, August 16, 2009

Blogspot Scrollable Label Select Box

**Edit Aug 27, 2009** This scrollable link list may also be useful for my growing blog link list as well.

I was accumulating way too many labels in my food blog and needed an simpler way of showing them than just listing them out. So I worked out a way to put them in a select box. Here's my code in case you want to do it too. And see it in action at my food page.
<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'>
<form NAME="labelform">
<div>
<select name="labelselect" size="12" WIDTH="230" STYLE="width: 230px" onclick="window.location.href=document.labelform.labelselect.value">

<b:loop values='data:labels' var='label'>
<b:if cond='data:blog.url == data:label.url'>
<option disabled='true' value='data:label.url'><data:label.name/>&#160;(<data:label.count/>)&#160;</option>
<b:else/>
<option value='data:label.url'><data:label.name/>&#160;(<data:label.count/>)&#160;</option>
</b:if>
</li>
</b:loop>

</select>
</div>
</form>

<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>
Blogspot currently doesn't support selection of multiple labels at once, but if it does eventually support that, I'll probably switch over the select box to one of these nice scrollable checklists.

No comments:

Post a Comment