Search This Blog

Wednesday, November 29, 2006

Alert: Individual post page (permalink) can sometimes be blank pages, and what you need to do

Recently I answered a question on the Google Blogger Help forum by including a link to How to build traffic to your blog (click "BACK" button to get back to this page). She alerted me to the fact that the link leads to a blank page. I checked and found that it does lead to a blank page. I went the Dashboard of that blog, get to the "EDIT POST" tab, and click "VIEW" in that post, and got a blank page too. I copied the URL and pasted it into the address bar - same result. I tested to see if it is something in the post that lead to this problem by copying word for word (in the EDIT HTML mode, everything in the post editor and pasted it in a new post Duplicate: How to build traffic to your blog (click "BACK" button to return to this page) and the post was viewable, so it wasn't anything in the post. Someone with the nickname Wasted posted that I may need to republish the whole blog. I did that and sure enough, that problem post was viewable again.

So folks, perhaps it may be a good idea to republish the whole blog once in a while to ensure that you don't face a similar problem. You wouldn't want to view your individual post page one by one to verify that the problem don't exist. Anyway, I think I will also alert Blogger support of this problem, and hope that a similar problem will not exist in the Blogger Beta blogs.

Saturday, November 18, 2006

Blogger Beta: How to add a link list.

It is now very easy to add a link list to a Blogger beta blog. Just sign into Dashboard, in the relevant blog, click LAYOUT and you will be taken to the Layout page, where you will see "Add a page Element" in the sidebar section. Click on the "Add a Page Element" (See screenshot below. Click to enlarger):
Blogger beta Layout
After you click on "Add a Page Element, a pop-up will appear where you will be given a few choices of what you want to add. In the "Link List" choice, click "Add to blog" and the pop-up for configuring the link list is displayed (see screenshot. Click to enlarge):
Blogger Beta: Configure Link List
There are four fields for you to add and 1 drop-down menu. Fill in the title, for example, Blogger Resources. It is best to leave the "no of links to show in link list" blank so you don't have to worry about how many links you can add (no maximum). Add in the site URL and then fill in the site name (title or description). Then click "ADD LINK". The site name/title/description should appear below the "New Site Name" field. If you have somemore links to add, repeat the process untill you have all the links added.

When you are done, click "Save changes" and when it is successfully added, a new page element will be added to your Layout, normally at the top of the widget/page element list in the sidebar. If that is where you want it, then you are done. If not, drag and drop the new page element to where you want it, and press "Save".

Saturday, November 11, 2006

Why and how you should careful when clicking on links

A reader of one of my blogs commented: "How does the link thing work? I am new at this and do not want to click on something without first knowing what will happen. (chicken.)". Well, with the amount of phishing going around these days, it is wise to be "chicken" as you may get scammed. I am going to do one thing here. I am going to create a link to my enviromental blog (hoping to get more greenies) althought the link you see is something else.

Important: Your bank account needs verifying. Please log in and confirm your account details at Citibank login page (close new window to get back to this page). Try clicking on the link and see where it takes you. I promise it is only an innocent environmental blog and totally family safe, and is no scam. I hope you will also enjoy reading that environmental blog.

Note that if I happen to be a scammer, I may specially creat a page that mimik Citibank homepage with a login section which will record your user name and password. A wise "chicken" will first hover over the link and look at the taskbar at the bottom of the page. The actual URL for the link will be displayed there. This is for FireFox and Internet Explorer. For FireFox, an additional aid for security is if you ever land on a secure site like Citibank, the address bar background will be colored yellow, otherwise it will be just the normal white background. This is an additional reason for IE users to get FireFox (close new window to get back to this page). Try hovering your mouse over the "Citibank login page" link and observe what you see. Also, if you are using FireFox, notice that the address bar background color is white and not yellow as it should be for a secure bank login page like Citibank and should alert you that it there is something not right.

For Opera, when you hover your mouse over the link, a "pop-up" will appear to show the actual URL for the landing page of the link.

If you want to learn about how to make clickable links, read post How to make clickable hyperlinks (click "BACK" button to get back to this page).

If you are interested in the HTML for the "Citibank login page", look at the code in the box below:
<a href="" target="_blank">Citibank login page</a>

Thursday, November 02, 2006

How to put a copyrignt notice to your blog

Note: This is for blogs using the old classic Blogger template. For those using the New Blogger template, refer to Putting a copyright notice that automatically update. You may also be interested in What to do when your blog content is copied and how to discourage copying.

In practice, copyright notices are normally placed at the footer. Most Blogger standard template default footer put in placed at the footer to make it convenient for a blogger to just edit it, but have been commented out so that it is invisible. In your template, look at the bottom of the page for this block of HTML:
<!-- Begin #footer -->
<div id="footer"><hr />
<p><!--This is an optional footer. If you want text here, place it inside these tags, and remove this comment. --> </p>

<!-- End #footer -->

Delete the comments tags <!-- and --> and the text in between, and replace it with a copyright note, for example: copyrightcopyright HTML codePeter Chen. All rights reserved. (Note: the special HTML for copyright HTML code is actually an image of the special HTML character, and you will have to manually type it in rather than just a copy-paste operation).

So your final HTML for the footer will become:
<!-- Begin #footer -->
<div id="footer"><hr />
<p>copyrightcopyright HTML codePeter Chen. All rights reserved.</p>

<!-- End #footer -->

Note: If you have any problem with the codes, please put your comment in the comments section below.

Sunday, April 23, 2006

Blogger template tutorial Part 2

Update: I see from statcounter that people searching for Blogger beta (now New Blogger) are landing on this site. For those who want to add stuff to their sidebars, etc., looking for 3 column templates, etc., but using the New Blogger templates, please visit
How to add ads., hit counters, etc in New Blogger (formerly Blogger Beta)
Blogger Beta (now New Blogger): 3 column template
More Blogger Beta templates modified by Stavanger
New Blogger (formerly Blogger beta) templates for posting large photos, etc.
New Blogger (formerly Blogger Beta) 3 column template modified by Stavanger

Click on the screenshot to enlarge it. For an expanded screenshot, go to
Blogger template tutorial: Adding stuff via the template

You can customize your blog by editing the template or adding stuff like texts, hyperlinks, images, etc. to the template. Where in the webpage they will be displayed will depend on which part of the template you add the stuff in. The most common place to add stuff is the sidebar. For this, you will have to add the stuff in between the tags

As an example, let's say you want the stuff to appear before the profile section. You will then add the stuff just before the <$BlogMemberProfile$> tag. The rest, I think, is self explanatory in the screenshot.

If Blogger store of templates does not satisfy your appetite, and you want something more than some personal customization, you can always download ready-made templates. There are a number of free Blogger templates available online. Here is a listing, by no means complete:

Thur's template (3-column)

Random Bytes: Another 3-column template


Point of focus

Blog Templates

Galeria de Templates

Pannasmontata Templates

Blogger Templates by Angelicfx

Blogger Templates by Caz

Final Sense

Gecko & Fly

Blogger Templates for Blogspot Powered Blog

Maldita's Template for Free

Templates for Blogger Beta

At the moment, there are very few third party template for Blogger Beta available. Have a look at the following posts:
3 column template for the new Blogger by Ramani

More Blogger Beta templates modified by Stavanger

New Beta 3 column template modified by Stavanger of Blogcrowd

Christine's templates for Blogger Beta (Not free. Include photoblogging template for beta Blogger blogs, with maximized space for image display while not causing a side scroll on screen resolutions of 800x600px or larger.)

Please note that other than Thur's template, Ramani's template and Stavanger's templates, which I have used for some of my blogs, I have not tested any of the others and cannot vouch for them.

For an updated version of this tutorial, go to Blogger template tutorial: Adding content via the template.

Books from Amazon

Publishing a Blog with Blogger: Visual QuickProject Guide

Book: Blogging for Dummies

Wednesday, April 19, 2006

Blogger template tutorial

Update: Blogger has updated their default template which uses LAYOUT. However, this post is still relevant for those using the old classic Blogger template.

Blogger template

A template is a set of HTML files which define the appearance and functionality of the blog. You can use the templates that are provide by Blogger, customize the provided template or write your own.

To access Blogger template, log into the Dashboard, select the blog, click TEMPLATE tab. You will see the template displayed in the edit template window. If you have already done some customization, it is a highly advisable to always backup your template. To backup the template, highlight ALL the text of the template, right-click and copy (or ctrl+C), paste into Notepad and save under a suitable title like dummies17april06. Saving a template has saved the woes of many a blogger.

The Blogger template has 3 main components - HTML (Hyper Text Markup Language), CSS (Cascading Stylesheet) and Blogger tags. HTML tags tell a web browser how to display the page. It is a good idea to have some knowledge of HTML and a good place to learn is the online W3schools. CSS control the style and layout of the webpage. You can also learn about CSS in W3schools. When you submit a post to Blogger, it is saved to their database. When you publish something, the Blogger tags tell Blogger publishing program which information to fetch from their database and put it on the webpage.


Here are some examples of HTML tags to give you an idea of what it is all about. The heading of this section was coded as <h3>HTML</h3>. HTML tags occur in pairs - opening tags like <h3> and closing tags like </h3>. If you look in the template you will see this block of codes:

<h2 class="sidebar-title">Links</h2>
<li><a href="">Google News</a></li>
<li><a href="">Edit-Me</a></li>
<li><a href="">Edit-Me</a></li>

<ul> and </ul> are the opening and closing tags for an unordered list, while <li> and </li> define a line of the list. This block of codes was put in the Blogger tag so that you can conveniently edit it to suit your wishes. You can easily replace and Google News with an URL and description of your own. Similarly for and Edit-Me.

You may want to customize your blog by adding stuff like HTML, etc, to the template. For more information on this, go to Blogger template tutorial Part 2.

CSS (Cascading Style Sheet)

The cascading style sheet is placed at the beginning of Blogger's template and surrounded by the <style> and </style> tags and it will look like something like this:

<style type="text/css">
Blogger Template Style
Name: Minima
Designer: Douglas Bowman
Date: 26 Feb 2004
----------------------------------------------- */

body {
padding:40px 20px;
font:x-small Georgia,Serif;
font-size/* */:/**/small;
font-size: /**/small;

*/ and /* surround things meant as comments (information). It is only meant for the person reading the template and is not taken into consideration by the browser.

body {

means that whatever is surrounded by { and } are properties of the body of the blog. For example, background:#fff; means that the background of the blog is white in color. You may change it by changing background:#fff; to, say, background:red;

To learn more about CSS, go to W3Schools.

Blogger tags

When you submit a post to Blogger, it gets saved into their database, and this is where Blogger tags come into play. Blogger tags tell their blog publishing program which information to fetch from the database and put on the webpage.

There are 2 main types of Blogger tags: item-level tags and page-level tags. Item-level tags are those tags that have the $ sign in them, such as <$BlogItemAuthor$>. The tags get the actual information from Blogger's database and put it on the web. <$BlogItemAuthor$>, for example, display the blog author's name.

Page-level Blogger tags deal with the design and structure of a page. They tell item-level tags when and where they have to perform. For example,


commands that this is where the browser have to display Archive URL and the Archive Name.

To see an example of the placing of Blogger tags when the information from Blogger database is not fetched from the servers, see example

For more on templates, go to Blogger template tutorial Part 2.

Books from Amazon

Blogging: Genius Stragies for Instant Web Content by Biz Stone, former Senior Specialist on the Google Blogger team

Book: Blogging for Dummies

Thursday, April 13, 2006

How to build traffic to your blog

You have shed blood, sweat and tears to put up your blog, you wouldn't want the blog to languish in a corner. You want people to read it. You want traffic. How does one increase traffic to one's blog?

There are a number of settings you can do in Blogger towards this end. Sign into Dashboard, select your blog, click SETTINGS tab, then BASIC. Set "Add your blog to our listings" and "Show Email Post links" to Yes. And still in the SETTINGS tab, click FORMATTING and set "Show Title Field" and "Show Link Field" to Yes. Then still in the SETTINGS tab, click PUBLISHING and set your blog to ping

You should also ensure that Post Pages are enabled so that each individual post will have its own webpage and url. Go to SETTINGS > ARCHIVING and set ENABLE POST PAGE? to YES. Also modify the permalink to something more prominent. See Tip: How to make permalink more prominent (Close new window to get back to this page).

Also, you must have good, original, informational and interesting content that will bring repeat visitors. Good content also attract the search engines, which is important. Write often and regularly so that both readers and search engines will visit your blog regularly.

Get a keyword research tool and research for the right keywords to use for your blog. Optimize your posts for search engines. Keywords in url's are important for search engines. If possible, make sure the url of the blog and the post title contain the primary keyword. Separate the words by hyphen - as search engines cannot distinquish between separate words written as a single word. (Update: Please note that search engines CAN distinguish between words written as a single compound word. For example, google for blogger for dummies. You will find the link to with the words "blogger", "for", "dummies" highlighted. Try it yourself! The url of this blog would have been better if it had been (Important note: this advice is for people who are just starting new blogs or have just started a blog recently and have not been indexed by search engines nor have many inbound links, not for those whose blog have been on the web for a long time and whose blog have already been indexed by search engines and have many inbound links.)

UPDATE 8 November 2006: On a lighter (funny) note, another reason why you should separate words in the URL. See The top 10 unintentionally worst company URLs (close new window to get back to this page).

As the post title is part of the url of the individual posts, use keywords for the post title.If you want to see how the URL of your individual post page (permalink) looks like, go to that page or right-click on the time stamp at the bottom of the post (which is a permalink) and select "Copy short cut". This is for IE. The wordings will depend on the browser you are using. You will notice that part of the title is in the URL. This is important for search engines as they give priority to words in the URL.

Sprinkle your post body with secondary keywords especially in the beginning and end of the post. You may also choose to optimize your blog for the search engine with the help of free, non-expiring software like WebCEO (close new window to get back to this page), which also contains other useful tools like automatic search engine submission and tools for researching keywords. It will be a good idea too to take the course to learn about search engine optimization, etc. at WebCEO. It is free.

Get statcounter (click "Back" button to get back to this page)or something similar to track your visitors. It will tell you where your visitors are coming from, which search engine they use and what search terms they used to find your site. Use these information for your keyphrases. Statcounter also gives system statistics which will tell you screen resolution your visitors are using, and to optimize your blog for the majority of your visitors. In my case, I found out that there are still 10 to 20% of my visitors using 800x600 and that discouraged me from continuing with the 3-column format for my blogs. See update in Blogger for Dummies is now 3-column (click "back" button to get back to this page).

When you have updated your blog, ping the blog services designed specially for tracking and connecting blogs. When you ping the services, you are letting the services know that your blog has been updated and they will crawl and index your site, publishing your blog contents and in this way increase your blog's popularity. A good pinging service to use is Pingoat (close new window to get back to this page). You should also ping Google Blog Search Pinging Service (close new window to get back to this page)

Update: Tried the Google Blog Search Pingging Services. When I tried it, it gave a message "Thanks for sharing your blog. We'll do our best to add it to our index as quickly as possible". I am thus not sure if I am really pinging them to tell them that my blog has been updated or just tried to add my blog to their index, which I believe have already been done.

Join blog and traffic exchanges. One of the best blog traffic exchange is BlogExplosion (close new window to get back to this page). Read How BlogExplosion can explode traffic to your blog (click "Back" button to get back to this page). If you want to join other blog and traffic exchanges, you can go to Support Enviroman (close new window to get back to this page) for a listing. (Note: If you have an AdSense account, it may be wise to not put your sites which have AdSense ads. See the update at this post: How BlogExplosion can "explode" traffic to your blog (click "Back" button to get back to this page).

The best way to get indexed quickly is to get an inbound link from a site that is already indexed by the search engines. If you have such a site, or if a friend has such a site, you should put a link to your site there, even if only temporary. Submit your blog to search engines and blog directories, especially major ones like Google add URL, Yahoo and DMOZ (close new windows to get back to this page). You may find other directories to submit your blog at this list: Best Blog Directory and RSS Submission Sites (close new window to get back to this page). If your blog is new and you want your blog to be indexed quickly by Google, a good idea is to add Google sitemap to your blog (some think that this only get your site spidered better). You can learn how to do that at "Adding Google sitemap to your blog" (close new window to get back to this page).

You may also add your blog to My Blog Directory. Click on My Blog Directory and at the bottom of the page, you will find a button Add Your Blog. Read more about how My Blog Directory can build traffic for your blog here: How to make a Blog Directory for your blog.

Add Google Sitemap to your blog. To see how, surf over to "Adding Google Sitemap to your blog". And each time you update your blog, ping Google Sitemap. Towards the bottom of the page there, there is a form for you to ping Google Sitemap. Bookmark that page so that you can return to it to ping Google Sitemap whenever you update your blog.

If your blog is not being found by the Google blogsearch, you can submit your blog here: Add your blog to Blog Search

Participate actively and meaningfully in relevant online forums, and leave a signature with a link to your blog. Comment (not spam) on other blogs. When visitors comment on your blog, return the visit and leave a comment on their blog, thanking them for commenting on your blog.

Build links to your blog. Offer to exchange links with blogs of similar content. Search engines will rank your sites according to the number of incoming links. Note: You have to be careful of who you link to. Do not ever link to a site which have been blacklisted by a search engine, or you think may get blacklisted by search engine. Also, it will be advantageous to you to exchange links with sites that have PageRank higher than yours. An easy way to find the PageRank of your blogs and other sites is to use FireFox with Google toolbar. See post How to get the PageRank of yours and other sites (close new window to come back to this page). You can get FireFox with the Google toolbar from that site or even this site itself. If you see no value for the PageRank, then it means the site has been blacklisted by Google.

Books from Amazon

101 ways to Boost Your Web Traffic: Internet Marketing Made Easier

Blogging: Genius Stragies for Instant Web Content by Biz Stone, former Senior Specialist on the Google Blogger team

Wednesday, April 12, 2006

How to backup your blog

Backing up your Blogger blog

Why is it important to backup your blog? You got to protect it from accidental delete (not rare). Another matter to consider is the stability of the blogging and web hosting service and its hardware. Blogger, even though backed up by the giant Google, faced some hiccups recently because of a hardware problem and caused a real scare among bloggers recently. How to backup your blog?

Using Blogger to email you the post you publish

One simple way is to set up your blog so that each post you make is emailed to a chosen email address, preferably specially created for that purpose. Click SETTINGS tab, then Email, and add your chosen email address at BlogSend Address. These, however, will be pure text, and does not include the HTML and that means you will have to reupload your photos and redo you links, etc.

Using Blog Collector

There is an easy way to backup your blog. Download and install Blog Collector Lite (close new window to get back to this page). This is an easy-to-use non-expiring free software. There is a provision to Synchronize Blog, which means that subsequent backups only backup the new updates. When you have collected enough material, you can even choose to publish it as a book, either in Word or PDF format. They also have a paid version.

Using HTTrack to mirror your blog

Another way is to download HTTrack Website Copier (close new window to get back to this page). It allows you to download any WWW site from the Internet to your computer, building recursively all directories, getting HTML, images and other files.

Copying each post into Notepad and saving it somewhere safe

This method will be a bit labourous if you had not done it right from the beginning and have tons of posts. In the post editor, make sure you are in the EDIT HTML mode. Highlight everything inside the post editor window (click inside the window and press ctrl+A), right-click and select copy (or ctrl+C) and then paste it into Notepad (right-click and select paste or press ctrl+V). With this method, you will have all your links, photos, etc backed up.

IMPORTANT: Backing up your blog template

One should not forget to backup the template. To backup the template, sign into Dashboard, select blog, click TEMPLATE, highlight all the template, right-click and save to clipboard. Then paste it into Notepad or NoteTab (close new window to get back to this page). Save it under a file name like blog title-date each time before you make any changes to the template.

What if I had neglected to backup my blog or template

Well, if you have neglected to backup your blog and/or your template, what you will have to resort to is to follow the steps outlined in "How to recover from an unintended delete" (click "BACK" button to get back to this page).

Update: April 24, 2006
Blog Collector Lite has worked well for me because I used the standard Blogger Minima template for my blogs. If you are using standard Blogger templates, you will be able to backup all your posts right up to the beginning. If, however, you are using non-standard non-Blogger templates, or have modified the Blogger template extensively, Blog Collector only backup the posts in the main page. In this case, it is probably better to use HTTrack Website Copier for your backup.

Books from Amazon

Blogging: Genius Stragies for Instant Web Content by Biz Stone, former Senior Specialist on the Google Blogger team

Complete Idiot's Guide to Creating a Webpage and Blog

Thursday, April 06, 2006

Introduction to

In an earlier post "How to do categories" a simple method was described using as a workaround for doing categories for Blogger. However, a reader has indicated that she is not familiar with tagging system. That is the reason for this post. is a popular online public bookmarking system that is now owned by Yahoo and is a big improvement over the conventional bookmarking system. In the conventional bookmarking system, the bookmarks are stored in individual computers. This means that when you are away from the computer, the bookmarks are not available. Also, when the bookmarks become too numerous, they become difficult to find.

The advantage of bookmarking system is that the bookmarks are available wherever you have access to the Internet. You can also organize bookmarks through tags (words that describe an item saved on, which make them easy to find later, you can see which are the sites popularly tagged by others, or find related sites tagged by others. For example, you have an interest in astronomy, you do a search for astronomy, and there you will find a tag for astronomy. You click on the astronomy tag, and you will see all the sites which had been tagged with the tag astronomy on the page. is a wonderful resource I would recommend to anyone. To sign up for go to and choose your user name and password. After you register, you will be taken to a page where you can install an extension for Firefox as shown in screenshot. (If you are still using only Internet Explorer, I would highly recommend you to switch to Firefox as it is a better and more secure browser. To read why you should have Firefox, and also to download Firefox with the Google toolbar, go to Firefox Alert. After you install the Firefox extension, you will see 2 buttons on the toolbar - "My" button and the "Tag this" button. This is very convenient. When you click on the My button, you will be taken to a page where all your tagged sites are displayed. When you want to tag a site, all you have to do is to surf to the site, then click the "Tag this" button and a pop-up will appear (see second screenshot). Here you will enter the name of the tags for the site (you can name one or more than one tags). You can also select the recommended tags shown below. In the screenshot (click on image to enlarge it), I have selected the tags blogger and tools for the site. You may also jot notes in the 3rd box (not compulsory). When you are satisfied, you click SAVE and it is done. When you click the My button you will now see the tagged site displayed. See Also, on the top right hand corner, you will see all the tags you have use. The tags I have used for an account I set up for this blog are Introduction, Basic, General, Blogger_specific, Popular_or_useful, AdSense and Increase Traffic. If I click on General, I will see all the sites I have tagged with the tag General. This property can be used to do categories for Blogger.

Blogger has no provision for doing categories. has been widely used as a workaround to make categories for Blogger. To see a simple method which this blog used, go to "How to do categories".

Book: Blogging for Dummies

Publishing a Blog with Blogger: Visual QuickProject Guide

Wednesday, April 05, 2006

How to do categories

UPDATE 22 July 2008: This is an old post done before LABELS were introduced. For those blogs still using old Blogger classic template, please refer to Label (categories) list for old classic Blogger template and Scroll box for labels (categories).

Currently Blogger has no provision for doing categories, a very useful feature. If you want this, you will have to hack or do a work around. There are various ways, but I think this is the simplest:

1. If you don't already have a (close new window to get back to this page) account, create one. This methods uses tags. I already have one but I created another account specifically for this purpose. This is highly recommended. (If you are not familiar with, go to Introduction to (click "Back" button to get back to this page)
2. Go to the post page for the post you want to tag and tag it. If you are unfamiliar with how to do these, click this link: Introduction to (Click "Back" button to get back to this page). On the top-right hand side of page click on the tag you just created, and on that page note the url. The easiest way to do this is to highlight the url on the address bar and copy it. An alternative way to do it is to right-click on the tag and select "Save link as..." (this is for FireFox. For other browsers, the wordings will be different).
3. Log into Dashboard, select the relevant blog for which you want to create categories and click the TEMPLATE tab.
4. Creat a new "paragraph" or "links" in the sidebar by adding the codes you see in the screenshot below into the template where you want the "Categories" to be.
click on the screenshot to enlarge it

You will have to modify the url and the "description" to suit your own circumstances, for example, changing
<a href="">General</a><br />

<a href="tag url">tag description</a><br />

5. Change the url and "description" of each tag you have for your "categories"
6. Repeat for the other categories you want to add. Add more links if you have more than mine shown in the screenshot, delete the excess if you have less.
7. Preview the changes (by clicking the PREVIEW tab on the template editor to make sure this is what you want. Make corrections otherwise.
8. Save the template and republish.
9. Surf to each posts and tag them with one or more categories.
10. A reminder. It is always a wise move to save the template before you make any modifications to it.

To familiarise yourself with how the system works, why not try it by clicking on some of the categories at the top of the sidebar.

P.S. Got the idea for this from this website.

For other more complicated ideas on how to do categories for Blogger, go to Fresh Tags, Blogger categories with, Freshblog, Labelr.

Books from Amazon

Publishing a Blog with Blogger: Visual QuickProject Guide

Monday, April 03, 2006

How to recover from an unintended delete problem

For a more comprehensive and updated post, refer to How to recover deleted post (updated).

Recovering from an accidental delete

You have accidentally deleted some posts or links, etc., or you may even have messed up your template, and you need to recover from the mistake urgently. What do you do?

This is what you can do. Do a search (Google, Yahoo, etc.) for some terms in your past post and see if it turned up some cached copies of your post. For example for this blog, I did a search for "how to add addsense to your blog" and the result was this:

Blogger for Dummies: How to add AdSense to your blogHow to add AdSense to your blog. First, you must have an AdSense account. If you don't have one, click on the button on the sidebar to the right that says ... - 21k - Cached - Similar pages

Note that it is a cached copy and not the current corrupted copy. Copy what you need from this cached copy. If it is something in the template, do a View>Page Source to get the template. You cannot copy the whole of the source codes to paste into your template as it also contain the codes for your post/s. Only can only copy the relevant part of the source codes (for example, customization such as links) to make easy a transition from a corrupted or accidentally deleted template to a new template.

Alternatively, you may type in the full url into the search box and it should turn up most of your posts.

If you can't find any cached copies in the search engines, another place to try is the Wayback Machine.

Related posts:
How to recover deleted post (updated)
Recover or restore accidentally deleted blog

Book for Dummies: Blogging for Dummies

Sidebar pushed to the bottom of the page

(For an updated version of this post, go to Sidebar slide to the bottom of the page: What to do?

For an example of how I go about trying to solve this problem, go to Trouble shooting sidebar sliding to the bottom of the page problem. An example)

A frequent complaint of bloggers is that the sidebar (profile, links, etc.) is pushed to the bottom of the page. This is a very common problem and may occur when viewed with both Firefox and Internet Explorer, or it may be OK with Firefox but not OK with Internet Explorer. This is usually caused by some content such as photo, table or long link exceeding the width of the content or sidebar column. Sometimes it is caused by incorrect coding such as missing or mismatched tags. Rat reported that once it was caused by a closing comment tag --> that had no opening comment tag <-- (HTML tags come in pairs, opening tag and closing tag). Look for these and correct it, and the problem should go away. (If you want to familiarise yourself with HTML, a good place to learn is online at W3schools.)

Other things you can try is to do some detective work. Think back to what you did before it happened. Undo that and see if that helped.

Another way to try to solve the problem is to change the width of the content and sidebar (the total width must not be less than the sum of the two). Look for these block of codes

/* Header
----------------------------------------------- */
@media all {
#header {
margin:0 auto 10px;
border:1px solid #ccc;


/* Content
----------------------------------------------- */
@media all {
#content {
margin:0 auto;

For the minima template, change width:660px; to for example width:800px;

Then look for

#main {
#sidebar {

and change the widths to, for example, width:500; and width:270; respectively (note that they total up to less than 800).

Preview and see if the changes are what you want. If so, save the template.

Always remember to backup your template before you fiddle with it.

The Weblog Handbook: Practical Advice on Creating and Maintaing Your Blog

Blogger for Dummies is now 3-column

Update 4 November 2006: For those looking for 3 column template for Blogger beta, please refer to post
Blogger Beta: 3 column template
More new Blogger (formerly beta) templates modified by Stavanger
New Blogger template for posting large photos, etc.

(note: Blogger for Dummies went back from 3 column to 2 column is back to 3 column again. See updates below.)

Finally made the switch to a 3-column Minima template for the blog, curtesy of Meneer Thur. I think it is much better now, but am worried about those with small screen. Will appreciate you leaving your reaction to this change in the comments section. There was a small initial snag. The content of the first post was way down from the post title. To solve this little snag, go to SETTINGS > FORMATTING and set the "Enable Float Alignment" to no. When the setting for the "Enable float alignment" was set to NO, the problem went away.

If you want to have a 3 column template too, you can get it from here: Thur's" Template. Just download the template you like and replace your current template with it . (This is an easy way for you to add a third column to a 2 column template. For those using the more common Blogger template where there are lots of blank space on both sides of the screen, this is also an easy way to get rid of the blank spaces.) Don't forget to save your old template before you do the replacement. In addition to acting as a backup in case anything goes wrong, you can also copy things like links, codes, etc, to paste into your new template. Doing this has saved me some work in changing over to the 3-column template, and also quite a bit of work when I decided to change back to the 2-column format. If you want to roll your own, you can try to follow Meneer Thur's 3-column template tutorial.

Update: 9.4.06

Got 1 negative feedback against a few positive ones. Then got a tip from Semavi Lady that one could temporarily resize window by typing "javascript:top.resizeTo(800,600)" into the location bar. Tried it and it worked like a breeze. Only problem, the result in 800x600 screen resolution was horrible. The sidebars width were unaffected, and the content column was narrowly squeezed in between the 2 still wide sidebars. Statistics says visitors to my sites with 800x600 res. was still between 10 to 20%. I sadly made the decision to revert back to the less desirable 2-column template. Sigh!!!

If you want to see for yourself how a 3 column blog with Thur's Minima clone, surf over to Digital Camera - choosing and caring for your digital camera. Type javascript:top.resizeTo(800,600) to view it in a 800x600 window.

Update: If you check the 3 column blog above and resize to 800x600, I think you wouldn't like it because the main column get squeezed into a very narrow column. I have modified Thurs template by making the sidebar width a bit narrower. When done, the blog when resized to 800x600 resolution doesn't look so bad. Refer to this post: Blogger template tutorial - 3 column template

UPDATE 2 November 2006: Blogger for Dummies is back to 3 column again. This is because I found a way to make the blog acceptable for those with 800x600 screen resolution. See post Blogger template tutorial: 3 column template (close new window to get back to this page.

Also, for those who have migrated to Blogger Beta, see this post: Blogger beta: 3 column template (close new window/tab to get back to this page)

Books from Amazon

Blogging: Genius Stragies for Instant Web Content by Biz Stone, former Senior Specialist on the Google Blogger team

Tuesday, March 28, 2006

How to make a blog directory for your blog

UPDATE: April 23, 2012: Looks like Blog Explosion is kaput. All the links to them is no "503 Service Unavailable". Got to disable all the links.

(Update: If you have an AdSense account, read the update at this post first: How BlogExplosion can "explode" traffic to your blog. Important)

Here is an easy way to add a blog directory to your blog and add your blog to MyBlogDirectory (and increase traffic to your blog at the same time). Click on My Blog Directory (this has been made a hyperlink for your convenience). This will take you to My Blog Directory. At the bottom of the page, click "ADD YOUR BLOG" and follow instruction. I will explain how this will increase traffic to your blog later.

Update: (some of it taken from the eMail of the BlogExplosion team)

Everyone needs lots of content on their blog to keep the attention of people that visit, so why not add a blog directory? Adding a Blog Directory to your blog means more sticky content on your blog which attracts repeat readership. People who read your blog directory may want to add their blog to your directory. When they do so, it uses your BlogExplosion referral url and you are credited for the sign-up (to make a blog directory for your blog, you will have to sign up for BlogExplosion (free) I have used various blog exchanges and of all of them BlogExplosion is the best). This means more BlogExplosion referral traffic to you! Your blog will appear in mine, in other's directory as well as BlogExplosion's directory, so you will be getting more incoming links to your blog. There is also a link at the top of your customized blog directory that means people can get back to your blog easily. To read about how BlogExplosion can 'explode' traffic to your blog, see "How BlogExplosion 'explode' traffic to your blog". BTW BlogExplosion is family safe as they don't allow blogs with explicit sexual content, images or text, severe profanity, hate blogs, blogs that promote violence and death, or blogs that support or encourage any kind of illegal activities.

Books from Amazon

101 ways to Boost Your Web Traffic: Internet Marketing Made Easier

Friday, March 24, 2006

How to get Blogger to host your profile photo

This post have been updated. Have a look at the improved post: Getting Blogger to host your photo for the profile, header, etc.

If you want to have a photo for your blogspot profile, you will have to host your photo on the web with a photo hosting service like photobucket . This will involve registering for an account. If you register for a free account, you have to log into photobucket at least once every three months, otherwise the account will be deleted. Even if you register for a paid account, you will have to keep your subscription. This is a work around to get your profile photo hosted by Blogger. Upload the photo into an empty post specially created for this purpose. If you don't want to have the post in your current blog, you can always create a special blog for this purpose, or post it to the current blog and resave it as draft after you have obtained the url for the photo. After you have posted the photo, go to that post on the web and click on the photo. This will take you to the page on the web where the photo is hosted. Copy the url from the address bar. Sign into Dashboard, click the EDIT PROFILE button on the top right hand of the page. Scroll down and look for the place to enter your photo url (see screenshot above). Paste it there and you are done. This idea came from Taz Kwok.

Update 27 March 2007: Things have changed with the introduction of New Blogger. Now if you delete the photo, it will be gone from the Web. Also, if you click on the picture to the page displaying only the photo, you can't use the URL in the address bar of that page as before. You will have to click VIEW in the menu bar, then select PAGE SOURCE to get the source code. You will have to search for the real URL of the photo from the source code. For a fuller description, go to Testing uploading of profile photo in the New Blogger (formerly Blogger Beta and Getting New Blogger (formerly beta) to host your photo for the profile, sidebar, etc. (click "BACK" button to get back to this page).

Publishing a Blog with Blogger: Visual QuickProject Guide

Wednesday, March 22, 2006

How to make a post remain at the top of the page.

Posts are sequenced chronologically, with newer posts appearing at the top. If you want a particular post to be always at the top (sticky post), you will have to play with the dates. When you create that sticky post, at the bottom, click POST AND COMMENT OPTIONS, then predate your post to the latest possible, as shown in the screenshot above.

UPDATE 21 January 2007: For the New Blogger (formerly beta), see posts New Blogger (formerly beta): How to add AdSense or sticky post, etc. at the top of every page of your blog.

Book: Blogging for Dummies

How to change order of the posts

The posts in Blogger are ordered in chronological order. So if you want to change the order of the posts, you will have to change the dates and/or time of the posts. In the Create or Edit posts mode, click the "Post and Comment Options" at the bottom left-hand corner and select the relevant date and time as shown in the screenshot.

If you want to reverse the chronology of the post using scripts, refer to Change order of Blogger posts

Note: Changing the date and time of the post will alter the url of the individual post page (permalink). So if you have any inbound links to that post, these links will be broken.

Update 1 April 2012: For the updated Blogger post editor, this option is now in the right sidebar of the post editor. You will have to click POST SETTINGS at the right sidebar, then click SCHEDULE (see screen shot below):

Blogger updated post editor schedule set time date


Publishing a Blog with Blogger: Visual QuickProject Guide

How to contact Blogger Support

Update 21 November 2010: It is no longer possible to contact Blogger Support. Google have resorted to creating Help Forums with voluntary contributions from users of their products including Blogger to provide support to other users. The Help Forums are frequented by Google Employees but most of the questions are answered by more experienced users with occasional input from Google Employees. For Blogger, go to Blogger Help Forum.

If your problem is related to restoring deleted posts, blogs, gmail and Google accounts, please refer to FAQ: Restoring deleted posts, blogs, gmail and Google accounts.

Update 30 March 2008: This should have come earlier, but so short of time. Now you can only contact Blogger support for account and TOS (Terms of Service) issues via Blogger Support Contact Form. If you are not already signed into Blogger, you may have to sign in before you get to the Contact form.. All other requests for support should be directed to Google Blogger Help group. I am also providing support at Blogger General Discussions. Note also the email address given below cannot be used anymore. However, if you have a suggestion, you can try Blogger Wishlist.

Update 21 October 2007: Blogger keeps changing the way they can be contacted and I have given up updating this post. If you want, just try your luck. I couldn't get through just as another blogger (see latest comment) but there was another comment where a blogger said he got a reply but his problem still not solved. Wish I remember which post it was made as I would like to ask him how he got through. BTW a Blogger representative says Blogger support do read the messages but will not reply unless they want further information.

Update 12 November 2006: This post is out of date. Please refer to post How to contact Blogger Support updated (close new window to get back to this page). Please make sure you read the updates there.

Update 23 October 2006: Recently, Blogger has made it very difficult to contact Blogger support. The links to the contact form have now lead to a new page. Will update if I have any further information. In the meantime, you are encouraged to use the Help files and the Google Blogger Help group.

Blogger support makes their contact form or email difficult to find as they want support seekers to first use their HELP section. You should also try searching through, or posting your problem to the Google Blogger Help group: Blogger Help Google group. Look also into Blogger Buzz and Blogger Status to make sure it is not a known issue that can be solved on your own. If it is anything connected to Blogger Beta, look into Known Issues in Blogger Beta.

When you have done that, and you can't solve your problem, or it is not a known problem, then go to Blogger "Talk to us"
and submit your problem there.

Update: Blogger has changed the URL to the contact form. The new way to get in touch with them is via CONTACT US. (close new window to get back to this page)

You may also try to email You will very rarely get a human response. Expect an automated email response. Reply to this email. We have got human responses this way.

If there is a feature you want, or you have a suggestion to make to Blogger, go to Blogger Wishlist.

Update: I have got an email from a reader saying that he accidentally deleted his blog. After contacting Blogger support, and after a series of email, he has got his blog undeleted!!!! So folks, there is hope.

Books from Amazon

Essential Blogging : Selecting and Using Weblog Tools

Tuesday, March 21, 2006

Another quick way to do a table

It is difficult to do tables with Blogger as browsers count more than 1 space as a single space, as mentioned in my previous post "how to do a quick and dirty table". If you don't want to use the <table> tag, and you don't want to use the "how to do a quick and dirty table" tip, you may want to use Excel to do your table if you have it. Enter the data into the Excel spreadsheet. Format it the way you want your table to appear. Highlight the data of the table and copy into clipboard, log into Dashboard, select the relevant blog, create a post, put the cursor where you want the table to be, right-click, paste. Viola, your table will be inserted and formatted the way you want it to be. Below is a table done using this method:

Item code Price
Apple 123 1.25
Orange 242 1.45
Pear 254 1.36

Syndicating Web Sites with RSS Feeds For Dummies

Blogging: Genius Stragies for Instant Web Content by Biz Stone, former Senior Specialist on the Google Blogger team

How to change the blog Header and the description

Many readers and participants of forums asked for ways to do the above. I though a post about it will make answering such queries easier.

To change the blog header/title, and to add or change the description, sign into Dashboard. Select the blog, click SETTINGS and by default you will be in the BASIC sub-tab. There you will see the field for the Title and the Description. Edit or add in the title or description you want.

To make it clearer, I will add in a screenshot later. My own computer is in the workshop now and this computer doesn't have the program for me to create the screenshot .

How to put a new paragraph in the sidebar

To customize templates, it is good to learn HTML. (If you want to learn about html, go to W3 School for some very good html tutorials.)

To add in a new paragraph with a title in the sidebar, you will first access the template editor. See post How to add stuff to the sidebar (click "BACK" button to get back to this page).

Just type in any text in suitable places of the template, using Blogger template tutorial: Adding stuff via the template (close new window to get back to this page).

If you want to have a title to your paragraph, you will have to use HTML. Just copy the example in the screenshot above. If you don't want to go through the hassle, highlight all the text in the box below (click and drag your mouse or click inside the box and press ctrl+A), right-click on your mouse and select "copy" and paste it in the appropriate place in the template. This post Blogger template tutorial: adding stuff via the template (close new window to get back to this page) will guide you as to which part of the template to paste according to where you want the stuff to be in. Then change the heading and the stuff you want to add between the <p> and </a>. To add stuff in the sidebar, place what you want to add after <div id="sidebar"><div id="sidebar2"> in the template. To put a new paragraph, type in those codes.

<h2>Type your heading here</h2>
<p>Type your paragraph here</a>

If you do that, in the sidebar, it will turn out like this below:

Type your heading here

Type your paragraph here

You may be wondering where in the template you should type in the codes. If you want the paragraph to appear just below the profile, then just follow the screenshot at the top left corner of this post. If you want the paragraph to appear in other places, refer to this post: Adding content via the template (close new window to get back to this page)

PS. You have to do this in the post editor. To access the post editor, sign into Dashboard, select the blog, click the TEMPLATE tab, and the post editor will open.

Books from Amazon

Buzz Marketing with Blogs For Dummies (For Dummies (Business & Personal Finance))

For ads after each post, where to paste the codes?

Update 8 April 2008: Please note that this post was written before the New xml Blogger template was introduced. It can however be still applicable if you are still using the old classic Blogger template.

(for New Blogger (formerly Beta), please see update at bottom of the post)

If you want the AdSense ads to appear after each posts, paste the codes after the <$BlogItemBody$> as shown in the screenshot above.

Update: AdSense TOS place a maximum of 3 ad units on any page. Strictly, if you have more than 3 posts on the main page, that theoretically will place more than 3 ad units on the main page. I have more than 3 posts for this blog, and I have pasted the AdSense script such that the ad unit get displayed at the top of every page. In fact, I also am supposed to have a Wide Skyscraper ad unit in the sidebar. However, AdSense detect that and do not display the extra ad units. The ad unit in the sidebar will only be displayed when one go to the individual post page (permalink), in which case, only 2 ad units will be displayed, one above that post, and one in the sidebar.

After reading the number of publishers who have their account suspended, I decided to be extra careful. To make sure, I contacted AdSense Help regarding the matter, and the reply was that it is OK for this particular blog. Whether this means we have to get clearance for every blogs that have this feature or not, I do not know. I think I will contact AdSense Help once more to make sure. Sure don't want to have my account suspended. You can leave things as it is and take the chance (or contact AdSense Help Center AdSense Help Center or just take the chance. Or you can ensure you comply with the TOS by adjusting the number of pages that get displayed on your main page, for example, if you only have ads in the post, adjust that to display only 3 pages in the main page).

UPDATE: I have been reading numerous reports of AdSense account holders having their account suspended, often without the exact reason for the suspension being given. I have contacted AdSense Help once more for a more definitive answer but the answer were vague, just referring to the fact that one should have a maximum of 3 ad units on each page. As such, I have decided to stop using this for my site, and instead of putting ads in each post, I have put the leaderboard ad unit just below the header. Better to be safe than be sorry.

ANOTHER UPDATE: Another AdSense Publisher, Sherry, did her ads exactly as described in this post, and contacted AdSense Help Center for clearance. Her blog is here: AdSense and Affiliates. She got this reply:

Hello Sherry,

Thanks for emailing us about our policies.

I've reviewed your website and found the number of Google ads displayed to be in accordance with our program policies. On any given page, you're welcome to place up to:

- three standard ad units
- one link unit
- two search boxes
- four referral units for different products

For additional questions, I'd encourage you to visit the AdSense Help Center
(, our complete resource center for all AdSense topics. Alternatively, feel free to post your question on the forum just for AdSense publishers: the AdSense Help Group (

I hope you find this information helpful.


The Google AdSense Team

So folks, it is really up to you whether you want to use this method to display the AdSense ads or not.

UPDATE 21 January 2007: For New Blogger (formerly beta), please refer to post Incorporate AdSense ads into your New Blogger posts.

UPDATE 9 September 2007: There is an easier way to put Google ads between post now with New Blogger templates. You don't even have to get into the template editor, only the LAYOUT. See Ads bewtween for blogs with New Blogger templates

Books from Amazon

Make Easy Money with Google : Using the AdSense Advertising Program

Sunday, March 19, 2006

Where to paste the AdSense codes?

Update: This is an old post but is still applicable to those using the old classic Blogger template. Those using the New xml Blogger template should use the HTML/Javascript gadget (Page Element)

Where to paste the AdSense codes? This will depend on where you want the ads on your site. Probably the most prominent place to place it will be just below the header, like on this site. If so:
1. log into Dashboard
2. click the TEMPLATE tab
3. look for the codes you see above and paste the codes where you see Paste AdSense codes here

Update: With the newly introduced Blogger Beta, there is now an easier way to put in your AdSense (and other, eg. Amazon) scripts, and to move them around. See Blogger Beta - adding advertisement and hit counter scripts

Books from Amazon

Google Advertising Tools : Cashing in with AdSense, AdWords, and the Google APIs

How to add AdSense to your blog

First, you must have an AdSense account. If you don't have one, apply to join the program. There are bloggers who have got approved AdSense accounts and they may put referral buttons on their blogs, and you can apply for an account via the referral buttons on their blogs. One of the blog is AdSense Alert (close new window to get back to this page), which also have more details about the AdSense program. This blog itself is another site. You will first need a site with reasonable content for them to review. The easiest way to get a site is to start a blog. A friend of mine got his application approved with a blog with just one post. There are various ways to earn through AdSense and they are described in this post: How do I earn from Google AdSense (close new window to get back to this page). You must then generate the scripts for the ads, referral buttons or searchbar. This post describe the way to generate scripts for them: Generating scripts for your AdSense ads, referral buttons and searchbars (close new window to get back to this page).

Then you will have to add the scripts in the appropriate places in the template depending on where you want them displayed. For Blogger classic templates, see for example these posts:
Where to paste the Adsense codes (click "Back" button to return to this page)
For ads after each post, where to paste the script (click "Back" button to get back to this page).
For other positions, this post can guide you: Blogger template tutorial - adding content via the template (close new window to get back to this page).

For those using the Blogger beta template, read this post: Adding advertisements, hit counters, etc to Blogger Beta (close new window to return to this page). For those who want to add a working Google searchbar, see this post: Testing adding of Google AdSense searchbar to Blogger beta blog (close new window to get back to this page).

Books from Amazon

The AdSense Code: What Google Never Told You About Making Money with AdSense

Make Easy Money with Google : Using the AdSense Advertising Program

Google Advertising Tools: Cashing in with Adsense, Adwords, and the Google APIs

Money For Content and Your Clicks For Free: Turning Web Sites, Blogs, and Podcasts Into Cash
Related Posts Plugin for WordPress, Blogger...

Find topics by using the Google custom search box above which can search multiple blogs, or the SEARCH BLOG in the left corner of navbar. You can also find topics in the Label List and Categrories in the right sidebar.

For more information and special deals related to any of the issues on this page, place your cursor over the double-underlined links. All information supplied by

Disclaimer: This blog has no relation with Wiley Publications