Mashable like Share Buttons using Socialite and Sharrre

Mashable-like Share Buttons Widget. This widget mimics the design and functionality of the social media buttons of Mashable.com . It uses Sharrre jQuery plugin for getting the counts for various social Networks and Socialite for asynchronously loading the buttons. The Sharrre plugin has been modified a bit to return values inside a data- attribute . Also unlike Mashable , a single hover event tri…

[click to continue reading]

20 Great Resources for Blogger Users

If you just getting started with Blogger platform , these are some great blogs to include in your reading list. Each one of them is full of unique tutorials and pro tips that can keep you hooked for days together. Every blog in the list has a different focus , with some focussing on Tips and Tricks while other writing about Widget Creation and Tutorials. Nonetheless each resource is full of quali…

[click to continue reading]

Random Post Widget for Blogger

Random Post Widget for Blogger blogs. A simple way to display arbitrary posts from your blog's archives. This widget comes with loads of customizable options which can be easily configured using the Widget Generator found later. This is inspired from Aneesh Joseph's Random Post Gadget using the Blogger API. That gadget failed unexpectedly sometimes due very large iFrame URLs and the brows…

[click to continue reading]

Lazy Loading Floating Share Bar Widget for Blogger

Presenting the Lazy Loading Floating Social Sharing Bar Widget for Blogger. It provides easy sharing options to your readers without the disadvantage of slow page load times attached with these buttons. The widget uses Socialite to asynchronously load all the scripts and styles related to the buttons as and when the user hovers over the widget. The widget comes in mainly two versions , one with s…

[click to continue reading]

Lazy Loading Social Share Buttons in Blogger using Socialite

Every Social Network's share buttons effect page load speed and size badly. Asynchronously loading the resources is one way to get around this problem. The lazy loading buttons I shared previously had a problem which only allowed single instance per page. Socialite addresses that issue and is much more versatile than the previous script. It has all the awesome features and still manages to ke…

[click to continue reading]

Installing IntenseDebate Comments in Blogger

IntenseDebate is feature-rich comment system which can be used in place of the default Blogger commenting system. The Blogger's commenting system is improving by the day with features like Threaded Comments being introduced but still it lacks some features that are inherent in many other commenting systems available across the net. In this tutorial we will seeing how to install Intense Debate…

[click to continue reading]

Five CSS3 Breadcrumb Designs

Breadcrumbs are an alternative navigation. Not only do they act as a visual aid to inform the reader about their position in the blog's hierarchy but also give a more structured feel. The previous post was about how to integrate Breadcrumbs into Blogger and this one is a showcase of 5 designs which you can use in place of the default design provided before. All of these designs use CSS3 exten…

[click to continue reading]

Breadcrumbs for Blogger

Breadcrumbs are navigational elements that are used to display the depth at which a user currently is in a website. Normally they are present near the top preferably just above post heading or the main heading of a page. In Blogger there are no real sub-directories for which you can show a hierarchical path so we will be using Labels as workaround. We will also be discussing how to display single…

[click to continue reading]

Blogger Label Widget Style #3 and #4

Tag Clouds are used to display all the categories or labels present in a blog. The inherent design of this widget in Blogger is very minimal and has a lot of space for creativity. In this post we will be showcasing two Label Widget designs which you can easily integrate within your blog. Both these use :after and :before selectors to manipulate the tag's design at the edges. Also CSS3 Gradie…

[click to continue reading]