Adding RSS Feeds for Labels on Blogger

1. Go to layout and add a widget for Labels.

2. Click at the top where it says "Edit HTML".

3. Click the link that says "Download Full Template" and save the backup file to your hard drive in case something goes wrong.

4. Check the box to expand the widgets.

5. Search for this line:

<b:widget id='Label1' locked='false' title='Labels' type='Label'>

6. Select the whole widget by selecting that line, all the way through to this one:

</b:widget>

NOTE: Be careful that it is the first line like that after the "<b: widget id='Label1' " otherwise you may wipe out another widget when you make the edit.

7. Replace the selected text with the following Make sure you change the blog url shown in RED to match the name of your blog, otherwise it will point to my blog and not yours.

<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'>
<div class='labelcolumns'>
<ul>
<b:loop values='data:labels' var='label'>
<li>
<b:if cond='data:blog.url == data:label.url'>
<span expr:dir='data:blog.languageDirection'>
<data:label.name/>
</span>
<b:else/>
<!-- RSS icons by BittBox.com -->
<a expr:href='&quot;http://cranialsoup.blogspot.com/feeds/posts/default/-/&quot; + data:label.name'><img src='http://appsapps.info/blog/blogspot-layouts/widget-frenzy/rss/rss_icon_glass12.PNG'/></a>
<a expr:dir='data:blog.languageDirection' expr:href='data:label.url'>
<data:label.name/>
</a>
</b:if>
<span dir='ltr'>(<data:label.count/>)</span>
</li>
</b:loop>
</ul><br/>
</div>
</div>
</b:includable>
</b:widget>

The default color icon is the traditional orange. If you want a different color icon, replace the green url with one of the following.

8. Make sure you click "Save Template".

If anything goes wrong, restore your template or contact me.

Very Important Note: The RSS icon images are Creative Commons licensed and you have to give credit by linking back to the creator somewhere on th page. Go to Page Elements tab in Layout and create a new widget. Select "HTML/Javascript" as the widget type and copy in the following code:

<a href="http://www.bittbox.com/freebies/free-glass-style-rssfeed-icons/" target="_blank">RSS icons by BittBox</a>

To make multiple columns like I have on my blog (great for if you have a lot of labels), you can move the blog widget to the widest part of your template in the Layout Page Elements view (footer is always good place) and add the following CSS to the top section of your template in Edit HTML, right before this: ]]></b:skin>

/* Label Columns */
.labelcolumns ul {
width: 100%;
list-style-type: none
}
.labelcolumns ul li {
float: left;
width: 20%; /* accommodate the widest item, adjust if necessary */
}
.labelcolumns br {
clear: left; /* stop the floating after the list */
}