Thursday, 24 December 2009

How to copy / recover a link list

Why would you want to copy a LinkList? I can think of at least two reasons: You accidentally deleted your LinkList and want to recover it. You have a long link list and would like to import it into a new blog. You can re-enter the links one by one yet again, but why? Copying it is much easier. Recovering deleted LinkList Do a site search on your blog. Enter site:YOUR BLOG

Tuesday, 22 December 2009

Adding a Nabble embeddable forum to Blogger

So you want to put a forum / bulletin board on your Blogger/blogspot blog. A chatbox, shoutbox or comment widget in a sidebar just doesn’t cut it, you want a real forum, for free. You heard that it can’t be done. Well it can be done really, with Nabble embeddable forum (thanks to Ralph for sharing the info). Here is a step by step guide to make your real forum a reality: Create a forum

Wednesday, 16 December 2009

How to create a spoiler or show-hide effect

Here is a very simple show/hide effect code for you to copy and use. This effect is also known as a spoiler or a peek-a-boo. It uses a small inline Javascript. You can use this code anywhere, be it in the sidebar or in your blog post, as long as you can add the spoiler code to it. [Update Mar 2013] See our new and improved content spoiler. This code will add a button, clicking it will expand

Saturday, 5 December 2009

Listing post titles in alphabetical or chronological order

In this tutorial I will show you how to list the titles of your blog’s 1000 2000 most recent posts. If you are looking for an alternative to Blogger’s Archive gadget, then this might be it. This list can also be used as a Table Of Contents. This list is made possible with the use of Yahoo! Pipe. See the demo in Blogger Sentral Widget Showcase. The list comes with several options: List them

Saturday, 28 November 2009

How to install “link to us” link exchange widget

This is my second tutorial on adding a link exchange button/badge/banner widget to your blog. Unlike my previous link exchange button tutorial, where your readers need to copy and paste the button code into their blog, this method lets them install the button just by clicking a button -no code will be displayed, no copy-pasting required. Note: This method only imports the button into a Blogger

Friday, 20 November 2009

Open multiple links / windows in a single click

A reader asked if she can make a navigation tab open more than one link when clicked. The answer is YES it can be done, with the help from a small Javascript. (Now if you came here looking for a way YOU can open multiple links on pages you visit, try Snap Links, a Firefox addon.) First let’s look at an HTML code for a regular anchor tag :Link text
When

Saturday, 14 November 2009

Replacing Blogger widget’s title with an image

If Google brought you here, then you might quickly realize that the gadget/widget titles in the screenshot are not actually titles. They are images, occupying the title slots . Why do some people put images there when they can do it with texts? Well with text, you only have limited choices of fonts and styling. If you want to use a unique font or styling like in the screenshot, then text image

Friday, 6 November 2009

Blogger Auto Read more with thumbnail

Update Feb 2010: Prevent read more from being applied to Blogger (static) Pages by adding static page conditional tag. Expandable post or popularly known as “read more” is a feature that make your blog shows only a part of your posts on index pages i.e. home, labels and archive pages. At the end of each preview there will be a link to the post page, usually attached to the phrase “read more”.

Thursday, 29 October 2009

How To Add a Three Column Blog Footer

Finding it hard to add widgets to your blog without overstuffing the sidebar? Ahh well, maybe it’s time to add a footer to your blog. This tutorial will show you how to do just that -install a three-column footer.

Login to your Blogger account (if you haven't done so already). Go to Template > Edit HTML.
Back up your template.
Look for the existing footer code near the end of your HTML. It

Thursday, 22 October 2009

Adding, removing and renaming a label across multiple posts

You can add, remove or rename labels without entering into each individual post. You don’t have to do it post by post, it can be done across multiple posts, in one go. Update Sep. 2011: Add instructions for new user interface. To do this, go to Dashboard > Edit Posts tab. Notice all the labels used in your blog are listed on the left side of the screen, under Labels. On the right is the list of

Monday, 12 October 2009

Customizing blog pager (Home, Newer Post & Older Post links)

This tutorial will show you five ways of changing the look of a Blogger blog pager. Blog pager are those “Newer Post(s)”, “Home” and “Older Post(s)” links at the bottom of your blog page. Here they are: Changing the text with your own text . Replacing the text with an image. Switch sides between “Newer Post(s)” and “Older Post(s)”. Adding background to the text. Removing the

Sunday, 4 October 2009

Installing a multi level CSS dropdown menu

I’ve had a few requests from readers asking how to install a dropdown menu. So here it is, a multi level dropdown/flyout menu. The original code is from CSSPlay. I modified the CSS part a little to adapt to Blogger template. This four level dropdown/flyout menu should work in most browsers. A tab with small caps indicates it has upper level/levels. A dropdown/flyout will appear when you hover the

Friday, 4 September 2009

Creating static pages in Blogger

Update Jan 2010 Finally Blogger has come up with the much awaited (static) Pages feature. So now you no longer need this hack to create static pages. However, you still have to do some coding if you want to make the static pages look different from other pages. Please refer to this tutorial: Apply different layout/styling to static pages Update 3 Oct 2009 Now you can truly

Monday, 31 August 2009

Limiting the number of posts in labels page

If you have lots of posts it helps if you can limit the number of posts appearing in a page. It will reduce the page load time and requires less scrolling by your readers. In Blogger, you can limit the number of posts appearing on the home page, but you cannot do so on the labels page. In this short tutorial I will show you how to put a limit to the number of posts appearing in labels page.

Sunday, 23 August 2009

5 ways How to back up a Blogger blog

Backing up your blog contents is very very important. Why? Because your Blogger/blogspot blog can be running smoothly today and yet it also can all of a sudden disappear, without warning. It happened before and will happen again in the future. Playing by the rules doesn’t make you immune either because mistakes do happen. So be prepared, and if you haven’t yet backed up your blog, then do it now.

Monday, 17 August 2009

Removing stubborn animated gif header image

As you may know Blogger blog header image can be uploaded or removed via Header gadget in Page Elements. All good and dandy, until you want to remove or replace the header image -because you can’t. If you use animated gif, and uploaded it using “From your computer” option, you probably won’t be able to remove it. This is maybe because Picasa Web Albums (Blogger image host) doesn’t support

Monday, 10 August 2009

Followers gadget wrong display

In Blogger Help Forum, a number of times I encountered questions regarding problems with Followers gadget profile display. Here are two examples: I have added an image to my profile, it shows up on the dashboard, however when I check on blogs that I'm following, no photo is shown. My Follower name is wrong! On the blogs I follow, my real name is listed, instead of my Blogger

Sunday, 9 August 2009

Free Blogger templates with glider/slider

Here is a list of free beautiful feature-rich Blogger templates that come complete with a glider, slider, carousel or something of similar effect. This type of templates is becoming more common nowadays. The features use JavaScripts, so if you were to use these templates, you need to upload the script files to a web host. The scripts are usually bundled together with the template downloads.

Wednesday, 5 August 2009

How to make a “Grab this” linkback button

Wondering how to make a “Link back to us” a.k.a “Grab this” button widget just like the live example below? Whereby readers would copy and paste the code in the textbox to display your button/badge on their blog? It’s easy, you can do it in just two steps.

Sunday, 2 August 2009

How to show Twitter updates on Blogger

Previous I explained how to tweet blog posts into Twitter in Adding a “Tweet this” button into blog posts. Well this time it’s kind of the other way around. We are going to make a widget that pulls your Twitter updates and embeds them on your blog. The content of the widget will be automatically updated every time you make a status update on Twitter.
new TWTR.Widget({
version: 2,
type: '

Saturday, 25 July 2009

Installing Google translator widget with flags

Do you want to reach wider international audience? What better way to do it than by allowing your readers to read your articles in his or her own language! Installing a translator on your webpage or blog will do just that. Google translator can translate your web page into 56 languages (as of 24 August 2009). In this tutorial I will show you how to add a Google translator widget complete with the

Monday, 20 July 2009

How to number comments in Blogger

Communicate better with your readers by improving your comments section. A while back I wrote a tutorial on how to highlight author comments to help readers spot blog author’s response to their comments. In this article I will show you how to number comments, in other words to display a number to each comment. Some of the benefits are: Having a number attached to each comment greatly

Saturday, 18 July 2009

Adding a column (sidebar) to Blogger template

In this tutorial we will attempt to create an additional column or sidebar to Minima Blogger template layout. We will add an exact copy of the existing sidebar (in pink). The main column, which contains post area will be left intact. As you can see in the layout, header, main and sidebar wrapper are elements contained inside outer-wrapper. In order to add a sidebar, you have to increase the

Sunday, 12 July 2009

Center or right align header image and title on Blogger

If you uploaded your header image via Page Elements, Blogger will automatically align it to the left. There are no options for middle and right alignment. So then, it possible to align the image in at the center or to the right of the header? Yes it is possible -using CSS (Cascading style sheet). But to define a HTML element in CSS you must first know the element ID or class name. After some

Thursday, 9 July 2009

How to embed a Picasa slideshow on a Blogger blog

Posting a picture in a post helps push the message across, after all a picture is worth a thousand words. But posting too many pictures will inevitably adds to the length of your post, sometimes too long for your readers’ comfort. How then can you add pictures while keeping your post short? The answer is by using a slideshow. I. Making the slideshow Go to Picasa Web Albums and sign-in with

Sunday, 5 July 2009

Finding blogspot blogs by location

Are you having trouble finding blogspot blogs from a specific location, like from a certain country, state or city? Or wonder if it is even possible to search for blogs according to their location? Well, it is possible, you can browse them from your Blogger Profile page. Here is how to do it. Go to Dashboard and click View Profile to view your own Blogger profile. Notice under

Friday, 3 July 2009

Creating navigation or menu tabs in Blogger

A typical navigation bar/tabs A navigation or menu bar is a bar made up of tabs. “Behind” each of those tabs is a link -to a post page, a static page, a label page, to another website etc. Making navigation tabs is not that difficult. They are basically links with some styling added for visual appeal. While links are arranged vertically,

Friday, 26 June 2009

Play Music And Video On Your Blog Using Yahoo Web Player

[Update Feb 2013] Update tutorial to reflect Yahoo!'s upgrade of Yahoo Media Player to Yahoo Web Player.[Update Jul 2013] Unfortunately Yahoo has shutted down Yahoo! WebPlayer, so the service is no longer available. So you want to add music (or video) to your blog? You want it playable right on your blog, yet you don’t want to annoy your readers with an auto-playing, difficult-to-stop audio? Well

Wednesday, 24 June 2009

Creating Top Commentators widget for Blogger

Update 24 Dec 2009: I’ve just realized that the Blogger emits the maximum of only 200 comments per feed, even when I specified 1000 comments (using max-results=1000 query parameter). It wasn’t so when I wrote this tutorial back in June. Anyway I’ve got the pipe fixed. For readers who cloned my pipe, please re-clone. And for those who use my pipe as it is, you don’t have to do anything. The

Friday, 19 June 2009

How to change blog (columns) width

Wish you could widen the sidebar to make way for your newly acquired widget, or increase the post area width so you can reduce the post area height, or wonder if you could use the empty spaces on the left and right sides of your blog? Well, stop asking and start reading, because I am going to make your wishes come true -by showing you how to change the width of your blog columns. This tutorial

Sunday, 14 June 2009

How to verify your blog in just two clicks

Update Oct. 22 2009: As of now, due to changes to the verification system in Webmaster Tools, the method explained below no longer works. You can read the announcement in Google Webmaster Central Blog. So now, to verify a Blogger blog, we have to use the conventional verification meta tag method, just like everyone else :(. To enable you to access all the features Google Webmaster Tools has

Thursday, 11 June 2009

50+ Free “Tweet This” buttons

Due to the popularity of Adding a “Tweet this” button into blog post post, I thought it would be better if I provide the links to some of free Tweet This buttons, so you don't have to go far to find buttons for the project. It turns out, Tweet this buttons are more difficult to find than Follow me buttons or logo. Anyway here they are: This set of buttons is made by assbach

Sunday, 7 June 2009

Showing only post titles on archive and label pages

When your contents grow, your index (multi-post) pages become bigger. This translates to longer loading time, and long loading time is of course no good to your blog because it sends your visitors away. One way to remedy this is by loading and showing only post titles on these pages. This will help speed up the loading time. It also make it easier for your visitors to browse your contents. This

Thursday, 4 June 2009

How to remove or restore Blogger navbar

If you are using Blogger default template, you may notice the dark blue bar on top of your blog, that’s the navigation bar or navbar in short. Actually it’s pretty useful, you can use it to sign in to your blogger account, to create a new post, share and customize your blog. You can also search for blogs, and flag or follow the blog you are viewing. Why do people want to remove or hide it then

Monday, 1 June 2009

How to highlight author comments in Blogger

Highlighting author comments help readers differentiate them from readers’ comments. This is especially useful, for example, when a reader come back to check on a reply to his/her question. Highlighting your reply/answer, will make it easier to spot. Remember, making things easier for your readers is a good thing. And in line with that statement, if you are using Blogger/blogspot, I’m going to

Saturday, 30 May 2009

Blogger “read more” without the bug

This hack was written before the introduction of Blogger jump-break (read more) feature. Blogger jump-break doesn’t have this bug. As you may notice many blogs use “read more” (a.k.a. expandable post) thingy on their homepages. For readers who are unfamiliar with this feature, what a read more function does is when you are at the homepage (or any index page), only post snippets are displayed,

Wednesday, 27 May 2009

Create printer friendly blog pages

You’ve probably seen this “Print this article” feature numerous times, on news websites, those free articles websites and even cooking/recipes websites. When you click the printer button or link, the print output would most likely be of a printer friendly version. This printer friendly thing, what is it anyway? Well it is a trimmed down version of your web page –usually excluding the

Friday, 22 May 2009

Adding a floating “back to top” button

Back to Top button or link is a link that sends your viewer to the top of page once clicked. This will help your readers navigate better, especially so if you have long pages. This link is usually located at the bottom of page or in the footer area. What I am going explain in this article is slightly different. The function is the same yet the location of the link/button is different. As the

Sunday, 17 May 2009

Using image as background

Using image as a background can be implemented easily using CSS (Cascading Style Sheet). In Blogger CSS can be accessed by going to Dashboard > Design > Edit HTML tab. CSS is the area between in the template code. (Update: If you are applying the background to a template made by Blogger Template Designer, use this method instead: How to use your own background

Saturday, 16 May 2009

How to backup a Blogger template

Why do I need to backup my blog template? you may ask. Because sometimes unexpected things happen, i.e. you accidentally mess up your layout. If you have the backup layout stored in your PC, then reverting to the original is easy. Less headache for you. You want to backup your template every time you want to tinker with the code. Better yet always keep a latest version of your template stored in

Wednesday, 13 May 2009

Google’s six principles of competition and openness

I stumbled upon a post on Google Public Policy Blog, posted a few days ago. The post is regarding Google’s approach to to competition. I thought I share it with you. As Google has grown, the company has naturally faced more scrutiny about our business principles and practices. We believe that Google promotes competition and openness online, but we haven't always done a good job telling

Sunday, 10 May 2009

Adding a simple image caption

A dragonfly in my backyard Having trouble adding image captions to your photos? I know I do, especially if you are using Blogger post editor. I’ve switch to Windows Live Writer, yet still it doesn’t get any better in this department. (with WLW I can do it though, with the right plug-in of course). Look at the picture, it does come with a caption. Okay, I’

Monday, 4 May 2009

10 tips for improving Google search results

There are times, even on Google, when you just can’t find what you are searching for. The search results just doesn’t come out “right”, what you want just wasn’t there. How you wish you could do something extra…to get better search result. Well today must be your lucky day, because I’m going to tell you that extra something, 10 tips for better Google searching. Hopefully these tips will give

Friday, 1 May 2009

A better way to add meta tags to Blogger

One way to improve your blog SEO (Search Engine Optimization) is to add in description and keywords meta tags. They are placed inside the head section of your blog template HTML. In description meta tag you put a description of your blog, telling what your blog is about. In keyword meta tag you put in key words relevant to your blog content. Duplicate meta descriptions There is a problem though

Tuesday, 28 April 2009

Adding a Twitter “Tweet this” button to blog posts

Adding a “Tweet this” button will enable your readers to share your articles with other Twitter users. This will help promote your blog and possibly increase your Twitter followers. The button we are making will appear at the footer area of each post. Update Nov. 2010 Twitter has come up with its official Tweet button. Visit Add Twitter tweet button to Blogger posts for a step by step

Friday, 24 April 2009

Making a tag cloud, easily

Update (August 2009) Blogger has finally added a Cloud option in their Labels gadget. To add a Label cloud, just select Cloud option (instead of List) in Configure Labels window. With this new Labels widget you can also choose to show all or only selected labels. ------------------------------------------------------------- I just finished installing tag / label cloud on the right sidebar.

Tuesday, 21 April 2009

Yahoo! or rather Ya..who?

Yahoo Inc. to cut jobs again after first quarter revenue fell by 13 percent. SAN FRANCISCO - Yahoo Inc. will lay off nearly 700 workers after getting off to a bumpy start under a tough-talking new boss who has promised to engineer a long-awaited turnaround at one of the Internet's best-known franchises. Neither the lackluster first-quarter results nor the job cuts announced

Monday, 20 April 2009

Best Free Blogger Template Sites

Last week I wrote about how to change blogger template and how to prevent you from losing your existing widgets when changing template. I thought you might want to know where can you get free blogger templates, so this time I’m going to list out the top free blogger templates provider sites: BTemplates This site cater just for Blogger templates. Huge selection of free templates,

Saturday, 18 April 2009

Submitting Blogger sitemap via Google Webmaster Tools

What is a site map? Sitemap is an XML file that lists URLs for a site along with additional information about each URL: when it was last updated, how often it changes, and how important it is in relation to other URLs in the site. Why do you need to submit a sitemap? Sitemaps allow you to inform search engines about pages on your blogs that are available for crawling. This allows search engines

Thursday, 16 April 2009

How to show code in blog post using Syntax Highlighter

Web browsers are smart, you give them codes, they render them into images and display on the monitor. That’s good, but what if all you want to do is just to display the codes in your post, as it is. There are quite a few solutions available on the internet, but what I am going to show you is think among the better ones. (Note: Before we proceed, if you plan to use this only occasionally, then

Sunday, 12 April 2009

Removing dead (broken) links from Google search results

I occasionally do a site search for Blogger Sentral to check whether my new entries are properly indexed by Google. How do I do a site search? Easy, you can do it too, just type this in Google search box.site:yourblogurl Google will search your blog and then display all your blog or site indexed pages. Last week I noticed a two dead/broken links showed up in the search results page. They are

Friday, 10 April 2009

Keeping your widgets when changing Blogger template

Update Feb 2010: Good news, Blogger has come up with an option to keep your existing widgets during template change. I guess you won’t be needing this tutorial anymore…oh well. Usually there is one problem with regard to changing Blogger template to a third party template –some of the existing widgets / gadgets will be deleted by Blogger upon saving of the new template. Now if you spent much time

Thursday, 9 April 2009

How to change blogger template

So you got tired with the look of your blog, or you think the template you chose when setting up your blog was a mistake in the first place? You tried to change the template with what Blogger provides but the choices is too limited. What to do? What to do? You change it to a third party template, that’s what you do. You come to the right place, because I’m going to tell you how to do it.

Monday, 6 April 2009

Turn Out Mag & Schemer Mag Blogger templates (with auto post summary)

I always search for ways to improve Blogger Sentral, to make it more visitors and search engine friendly. If you and the search bots are happy with my blog, then I’m happy. One of the things I did was adding a Read-more a.k.a expandable post function. It works fine, but there is one problem–every time I write a new post, I have to insert some codes into the post, otherwise it won’t work. Well,

Saturday, 4 April 2009

Using bullets in a list

You see the picture of bullets on the left? Those are not the bullets I'll be blogging about this time, well maybe next time hehe. This time I'm going to write about the bullet as in bulleted list. Yeah, bulleted list bullets can attract people's attention too, but not as deadly. Posts that contain bulleted lists in your posts will definitely help you get the message across to your readers more

Friday, 3 April 2009

Datuk Seri Najib Tun Razak is the new Prime Minister of Malaysia

As of today Malaysia has got a new Prime Minister. Datuk Seri Najib Tun Razak took his oath of office as the sixth Prime Minister of Malaysia before the Yang di-Pertuan Agong Tuanku Mizan Zainal Abidin at Istana Negara, Kuala Lumpur at 10 am. He replaces Tun Abdullah Ahmad Badawi who was in service for 6 years. If you would like to read more on this, please go to Malaysia Newsroom. It features

Thursday, 2 April 2009

Make A Link Opens In A New Window or Tab

We sometimes put links in our posts. And naturally our visitor will click on those links. By default when a link is clicked it will open in the same window. If your blog is like mine where visitors only come in once in a blue moon ha-ha, keeping them in your blog once they come in is crucial. We wouldn't want them visitors disappear from our blog through outbound links, now would we? But don’t

Tuesday, 31 March 2009

What is RSS feed?

RSS stands for Really Simple Syndication or Rich Site Summary. It is a format for delivering updated web content. It is used by web users to keep track of their favorite websites. The old not so simple ways In the not-so-distant past, keeping track of your favorite websites or blogs was done in a few ways: Memorize the URL of the blog and from time to time enter the URL into the address

Monday, 30 March 2009

How to change blogger favicon

First of all, what is favicon? Favicon is a little icon that precedes the URL in the address bar of your browser. Favicon is also displayed on the title tab. Now take a look at your address bar, do you have an icon there? Do you like it? If you do, fine. But if you don’t, you actually can change that. I’m going to tell you how. Below are the steps to replace your favicon: Design the

Saturday, 28 March 2009

Adding RSS feed button to your blog

When your visit a blog, you must have noticed those orange buttons on display, especially if they are big and shiny like the one on the left. Those are RSS feed buttons. You know what they’re used for right? (If not, please refer to What is RSS? ). But you might wonder how do you put one of those in your blog? Well, okay okay I’ll tell you how; Go find one in the net, just search for RSS

Tuesday, 24 March 2009

How to make great blog header

Yay! I did it. I changed the look of Blogger Sentral blog header. Now instead of boring, flat, amateurish looking title text, I’ve upgraded it to a 3D, polished look –more pleasing to the eyes than the previous one (at least I think so). It’s not as hard as I thought. At one time I thought of using GIMP to make it, but the lack of good looking fonts stopped me half way. I know fonts can be

Monday, 23 March 2009

Getting to know the parts of a blogger blog

You’ve heard about the terms header, sidebar, footer, nav bar etc. but no sure what they mean? Okay I’ll try to explain. The terms refer to the parts (the anatomy) of a blog. If we know the names, then it is easy to find more information about it on the internet. Below I explain the name of each part and its function. Please refer to the corresponding number provided in the layout:

How to start a blog

The term "blog" comes from two words - web and log (web log). It is a journal where your thoughts and opinions are recorded, just like the paper-based journal, but with three distinct differences (that I could think of); It is published on the internet rather than on paper. It is open for public to read (this is optional). It is interactive –readers can leave comments and you can