Blogger: Dropdown Menu Designer

Blogger provides a fairly bare bones set of tools for creating menus. More or less you're left to either accept generated links for Labels, Pages or required to build your own. These menus are primitive vertical or horizontal link lists. Blogger menus can get the job done, but I've always found them a bit underwhelming.

Take Your Menus to the Next Level
Over the past several weeks I experimented off and on to create a highly customized menu for this blog. This new menu includes drop downs which I think cleans the look up quite well while providing direct access to interesting posts, labels, pages, etc. I think this is much better than what Blogger offers out of the box, so I thought why not provide a tool so others can create their own.

Blogger: Label Summary with Thumbnails Widget

Maximize Blogger Labels with Thumbnail Summaries

A common complaint I've read from many Bloggers is how the lack of 'Categories' is a real sore spot. Blogger contends 'Labels' are equivalent, but objectors heartily disagree. For some time now I've contended the problem isn't so much a distinction between the two, but rather a lack of robust tools to exploit labels to their fullest.

I decided to address the Label problem by learning as much as possible about Google Gadgets, widgets and Blogger Feeds. After some time experimenting and working on demonstration code I built a pretty good understanding of the concepts their limitations and capabilities. I now have the ability to generate and process post feeds based on multiple Labels, the results mimic a Category and tag system. I am now ready to release a Widget script to leverage this ability.

Blogger: Random Posts Widget

All bloggers suffer from a common problem, How do I get new readers to visit the old posts they may find useful? New content is easily accessed since blogs are built to present things in chronological order. You work hard on a new post and it's only logical followers should know about that first. As time goes by this hard work gradually slips deep into the recesses of the Archive or Label search pages. It can be challenging for new visitors to find those interesting gems of the past without help.

The Random Posts Widget is designed to expose readers to content they might otherwise never come across. Instead of searching Google or digging through the archive visitors discover new things through serendipity. This adds value for users and generates more page views for a blog. It's important to organize the blog well, but Random Posts are an excellent way to help readers explore a blogs content.

Blogger: Related Post Links Widget

As many bloggers will tell you, it is important make a blog as user friendly as possible. Over time the number of postings grows and it gradually becomes more difficult for visitors to navigate and find relevant information. Blogger attempts to address this need through Labels and the Archive widget. I like many others find those basic tools a bit underwhelming and have sought other means.

I looked across the net to view example implementations for Related Posts. There are a wide variety of approaches from simple link lists to thumbnails with summary text. Some of these use extensive JavaScript and require messing around inside the Blog Widget template. Others it wasn't entirely clear how they were determining what posts are related. Dissatisfied with most of what I saw I decided to write my own.

Blogger: Animated Collapsible Widgets with JQuery

I began experimenting with JQuery this week while working on another project. It is my first experience with the library, having been away from web development until recently. While reading the documentation and experimenting I came across a nice animation effect similar to the function of the Collapsible Widgets script from earlier this week. So, I thought why not take things to the next level and add those animations.

Adding the Script to Your Blog
First things first, let's add the script to the template. Open up Design->Edit HTML then search for the </body> tag. Copy and paste this script just above that </body> tag.

Blogger: Collapsible Widgets

Recently, I came upon a request for the ability to Show and Hide widgets. This blogger had some long lists in the sidebar he wanted to make easier to skip through and condense. Another blogger found a solution here to alter the widget template with a show/hide anchor in the widget title. It works, but it occurred to me this would be cumbersome to maintain since it requires every widget template be modified.

I've come up with an alternate solution done entirely through javascript. The widget templates are not touched and adding collapse functionality to multiple widgets is much easier. All it takes is adding my script and the ID of the widget you want to make collapsible. Copy and paste the below script into your template just above the </body> tag.