Blogger: remove "Showing posts with label" section

I created some custom links that I placed as part of the header section for easy navigation between label categrories. When someone clicks one of these links, blogger sorts the content to only show content for that particular label. I've worked a lot on the overall design of the site and want a more seamless (non-blogger-esque) experience for readers.

It might seem picky but each time a list of labeled posts is shown, an annoying message is displayed to users such as "Showing posts with label XXXX". This also has a link to View all Posts. This message looks totally out of place on my newly designed template. The other annoying thing about this message is that it lets my readers know that they are still on a blogger site instead of a custom designed site.

So I did a lot of searching and I am dissappointed to report that I couldn't find an answer anywhere. So I went to "plan B". I looked at the source behind the HTML of the blogger page when that message was shown and I noticed that the section was called "status-msg-border". After a lot of playing around with the template, I figured it out. To remove the section completely, follow these steps:

• Login to Blogger
• Click on Template -> Edit HTML
• IMPORTANT! Back up your template before making any changes just in case you screw this up.
• Check the box to Expand Widget Templates
• Then use your browser's Find command (Control-F in Firefox and IE) and search for the words "status-msg-border"
• To be safe (just in case you want to ever show this section in the future, I just commented it out. You can either remove or comment it out. Here is the entire code to remove:

<b:includable id="'status-message'">  
<!-- remove the label show all posts stuff here -->
<!--
<b:if cond="'data:navMessage'">
<div class="'status-msg-wrap'">
<div class="'status-msg-body'">
<data:navmessage/>
</div>
<div class="'status-msg-border'">
<div class="'status-msg-bg'">
<div class="'status-msg-hidden'">
<data:navmessage/>
</div>
</div>
</div>
</div>
<div style="'clear:">
</b:if>
-->
</b:includable>

Save your template and click a label. No message should appear now.

* NOTE: This code has been tested for Beta Blogger / New Blogger only. No guarantees on classic blogger.

Removing the Permalink section from Blogger comments footer

I battled with this for hours and the answer was so simple, I almost cancelled my blogger account. So here's the deal, by default at the bottom of every post page where the comments are shown, there is a section called "Permalink" that is listed just under the last comment on the page. I kept wondering what the purpose of this section was. It made no sense to me having experienced the concept of permalinking at hundreds of sites on the web before. I just assumed (bad idea) that it worked as a unique and permanent link to this post for future reference. Well...Yes and no. Yes it is a permanent link, but it is not meant for the general public. Instead, it is a link for other blogger users to use to link to my post to help build search optimization linking for better search ranking on sites like google. It turns out the Blogger's term for this section is "Back Links". Here is a quick description of what they are (http://help.blogger.com/bin/answer.py?answer=42533).

After figuring this out, all I wanted to do was remove it as most of my readers are not blogger users and have no interest in this feature. I started searching google trying every phrase I could think of to get some useful results. I tried everything from "Blogger remove peramlink" to more complex terms like "Blogger remove comments footer Permalink Create a link". Nothing! Partially why I am writing this now is to solve this issue for future people.

Here's how to remove it:

• Login to your blogger account
• Navigate to Settings -> Comments
• Change the setting "Backlinks" from Show to Hide.
• Save Settings

That's it. Now go back to a blog post and look at the bottom of the comments. No more permalink section! If only someone else had written this first!

Third column in Blogger (rounders template)

I searched and searched on google and came up with a lot of dead-ends. I have been trying to add a third column to the left side of my other blogs for quite a few days. Then I came across this article by "Tips for New Bloggers" (http://tips-for-new-bloggers.blogspot.com/2007/05/three-columns-rounders-template.html) that worked PERFECTLY.

I highly recommend checking them out. Their tutorials are much more coherent and well organized than Blogging for dummies (whom I still like) but New Bloggers takes it to a higher level. There is not as much ad garbage on their pages either so they load faster and are easier to navigate. Check it out sometime:

http://tips-for-new-bloggers.blogspot.com/

Blogger customization

If you are looking for free tools, tips, and tricks to customize almost every aspect of your Blogger.com blog, look no further than BetaBlogger (http://betabloggerfordummies.blogspot.com/). This site is filled with tutorials, samples, and how-to's to get your blog looking exactly the way you want. It's amazing how much you can do to customize your personal blog.

There are tips on here as simple as adding an image to your title bar to more complex things like building your entire site template (colors, fonts, borders, backgrounds) from scratch. Want to add an automatic footer message or script to the footer of each post? They have it here: http://betabloggerfordummies.blogspot.com/2007/01/customize-post-footer.html

There is another site I came across with less content but I like the formatting and writing better. You can find a lot of good details on the new blogger features and some great widgets to add to your page for free (http://blogger-templates.blogspot.com/).

I will be spending the next couple of weeks trying different things to see what I can get working. Blogger is a powerful tool and I am interested to see how far I can get in customizing the site and adding unsupported features. Keep you posted...