Monday, December 31, 2007

Exciting news. Highly interesting widgets for Bloggers

Sorry readers, for reasons best kept to myself, I have to remove the content of this piece as I had been subjected to very unfair treatment. Please note carefully. It has nothing to do with the comments in this post.

For those whom I promised updates, I apologize for not being able to do it anymore.

Thursday, December 27, 2007

Increase traffic: participate in rssHugger

Through my activities in an an Environmental blog: Enviroman Says and my activities in Freecycle, campaign to keep usable items out of the landfills, I have come across TreeHugger, a very popular environmental site.

Now here comes rssHugger, a site that helps bring visitors to your blogs and surfers find blogs on subjects that they are interested in. rssHugger says they use the power of the environmentally friendly Internet and viral marketing to bring blog authors and blog readers together.

How does rssHugger works to bring about the above objectives? Truthfully speaking, I do not know yet. But I am a retired scientist, and scientists do experiments and research. That is what I am going to do. I will experiment with rssHugger and now after a long absence from my account with Statcounter, I will now have to start checking this blog statistics again.

Just in case some of you get uneasy about my mention of Statcounter, a free visitor counter, I would like to assure you Statcounter is only a hit counter which track hits to a website by putting cookies into your computer plus get information about what screen resolution, operating system, web browser, IP address of the visitors. It does not collect any personal identifiable details like your name, home address, etc., and is not a spyware although some time ago, its cookies are identified as spyware cookies by AdAware. I believe they have stopped that now as
AdAware have finally come to the conclusions cookies from Statcounter are not spyware cookies.

How does one gets to participate in rssHugger? You either write an honest review of rssHugger on your blog like this one or pay a one time review fee of $20 for participation of 10 years. I am afraid I am a pensioner who still have a son to put through college on my pension plus by nature, is a penny pincher. So here is the review which unfortunately is not much of a review as I am not in the program yet. The owner of rssHugger will personally check your blog for quality before accepting your blog into the program as he obviously is interested in quality, not quantity.

As I am keen to do this test, I have to make sure that this blog gets accepted into this interesting first ever program. I will thus have to somehow convince him this is a quality blog. I want to bring to his (and any other visitors) attention to the fact that this blog got listed in DMOZ, the most important directory (click BACK button to get back to this page) and the hardest to get listed, and this was without even submitting the blog to DMOZ. And the human editor who did this is not the only one who are of the opinion that this blog in very informative. You can check what grateful bloggers says about Blogger Tips and Tricks (click BACK button to get back to this page). By the way, that compilation was not compiled to boast, but the reason is given right at the top of the post.

Well, if this blog gets accepted into rssHugger, I will then have to update this post with some statistics, etc. Let's see how it goes.

Peter Chen's nice graphic signature

Wednesday, December 12, 2007

Error codes: What to do?

See List of bX- error codes

This is a common request for help: "I did..... and then got this message "error code bX-t8j6yl ......". I had made a feeble attempt to compile these error codes to try to make sense of them but have given up. What I normally do now is as follows:

I ignore error messages, try again AND often succeed on the second attempt. If not, then the third or the fourth or .....

Other thing you can try - use a different browser. This is not a "cure all", but what I consider as a "cure many". I have come up with all kinds of problems like unable to upload photos, a website took forever to download, cannot log into Blogger, online banking, all kinds of problems. When I get faced with such problems, I almost automatically use a different browser and in many cases managed to get done in another web browser. The web browsers I like the best are those web browsers with tabbed browsing.

Using a different browser may or may not help depending on the cause, but that has helped me through many, many different difficulties. Once you have the browsers in your computer it is very easy to do. See What to do when you cannot upload photos, sign into Blogger, etc.

I am so enthusiastic of this, I have 4 browsers in my computer - Internet Explorer, FireFox with Google toolbar, Opera and Flock. I used to have Netscape, but didn't download and install it after I got a new core-2 processor computer.

If you want to know more about why I am so enthusiastic about having many browsers, surf over to Why you should be using more than one browser (click BACK button to get back to this page) and get convinced. NOTE: THIS MAY OR MAY NOT HELP DEPENDING ON WHAT IS CAUSING THE PROBLEM, BUT HAS HELPED ME MANY TIMES

My favorite browser is FireFox. In this post, FireFox with Google toolbar, you wil see a screenshot of a section of the Blogger Help page where Blogger recommend FireFox. I recommend FireFox with Google toolbar for I find both very useful. You can download and install it via the "Make your PC more useful. Get the free Google Pack" text referral link in the left sidebar. Google Pack includes FireFox with Google toolbar plus other useful stuff which you can choose to install or exclude.

I previously uses the Google toolbar built-in spell check tool to check spelling (click BACK button to get back to this page) of my posts before I publish them. I find it much much better than the spell check tool in the Blogger post editor toolbar. That was FireFox 1.5. Now it is impossible to get FireFox 1.5. It has been upgraded to FireFox 2.0 and the FireFox Google toolbar no longer works with the Blogger post editor.

Regarding the FireFox with Google toolbar, there may be some privacy issue if you choose to add the Google toolbar with PageRank checker that you can install via the "FireFox with Google toolbar" button or via the "Google Pack" referral link which includes FireFox, or the "Browse the web better. Get FireFox with Google toolbar" text referral link, but that is not an issue for me as I don't think I have anything to hide. In any case, if you are worried about privacy, you can choose not to add the PageRank checker. Then there will be no privacy issues.

Others have recommended clearing cache and cookies, Me, I prefer to do that when I chose and not when I am forced to, to leave that as a last resort because clearing cache and cookies means you have to start a lot of thing from scratch and some pages may take longer to load. Once you have extra browsers installed, it is a very simple matter to use a different browser.

You can also try contacting Blogger support (not easy but not impossible). Refer to Problems signing into Blogger (Dashboard), etc (click BACK button to get back to this page) or contact Blogger Support (click BACK button to get back to this page).

UPDATE: Just had some problem uploading photo using Flock browser. Repeated attempts resulted in error code bX-i54acw. What I did - changed to FireFox. Problem solved. Photo uploaded with just one attempt.

Peter Chen's nice graphic signature

Monday, December 10, 2007

PageRank downgraded or unranked: What to do.

Let's address the second question first. All now website start with no PageRank. It is also probably not indexed. See Check if your website is indexed and how to get it indexed. For those who are in a hurry, see Fastest way to get indexed by search engine.

Your website may also be black listed by search for practicing Black Hat SEO (Search Engine Optimization) such as making text invisible by making the font color same as background.

A blogger complained his blog's PageRank has been downgraded to unranked. There can be various reasons why a website's PageRank may be downgraded. One of them is what they call the "Google Dance". Google changes its algorithm and some websites may get their PageRank increased, some downgraded, some downgraded very badly. I am not aware of anything we can do about this, unless you know the inner workings of Google search engines which they will NEVER reveal.

Or perhaps, you can. Check Google Webmaster Guidelines and see if you are complying with their guidelines.

After ensuring your website complies with their guidelines, if you don't already have a Google sitemap for your website, add Google sitemap (click BACK button to get back to this page) to your website, then go to Google Webmaster Tools, click "request reconsideration", select "request reconsideration", select the website if you have more than one, submit request, then pray hard.

Recently, I read that Google has downgraded blogs which participate in "Pay per post" to ZERO (0). I heard too that those who have Text Link Ads on their websites got their PageRank downgraded.

NOTE: Some sites recommend adding rel="nofollow" attribute to the <a> hyperlink tag that someone paid you to add to your blog, and then asking for reconsideration. This will probably work. Each person have their own views about what is right and wrong, but my view is that if someone paid you to put that link and you add that rel="nofollow" attribute to get your PageRank up again, I think one should inform the person who paid for the link and see if they agree or have some feedback. But of course don't take this as me telling you what you should do.

Peter Chen's nice graphic signature

Friday, December 07, 2007

Music for blogs or websites: Summary

Many bloggers are keen to have music, and though I am no big fan of music in blogs, they say customers are king. So here are some links to any posts I can find related to music:

Add music to your blog (click BACK button to get back to this page)

Add music to blog easy way (click BACK button to get back to this page)

eSnip music player in sidebar (click BACK button to get back to this page)

Embedding Imeen playlist

Embedding music with Imeen Part 2

Invisible music for blog

THIS ONE IS FOR SLIDESHOW BUT THE MUSIC YOU ADD IS GUARANTEED COPYRIGHT FREE TO USE

Music slideshow with Fliptrack (click BACK button to get back to this page).

Peter Chen's nice graphic signature

Saturday, November 24, 2007

Change main background color for Rounders template blogs

A blogger complained in my post How to change blog background color, fonts, etc that she could not find the option to change the main background color. I check the only blog I have which uses the Rounders template - Kids and teens - Tips and Tricks and confirmed that there was no option to change the main background color.

So while signed into my Blogger account and at the blog, there should be a "Customize" link at the top right corner of the page. I clicked "Customize" which gets me into the LAYOUT. I click the EDIT HTML sub-tab which opens the template editor. I found this code in the CSS (Cascading Style Sheet) of the template:

/* Variable definitions
====================
<Variable name="mainBgColor" description="Main Background Color"
type="color" default="#fff" value="#ffffff">
<Variable name="mainTextColor" description="Text Color" type="color"
default="#333" value="#333333">


and changed value="#ffffff" to value="#000000", preview and saw that the left sidebar and the main column (posts) background have changed to black. The right sidebar color remained original. So I discovered a way to change the main background color. However, since I have no intention to really change the color, I just click "Clear Edit" to get rid of the change and left the blog as it is.

If you want to learn more about HTML colors codes and how to get them, refer to HTML color codes, color charts and color pickers

If you have intention to change, perhaps you should also changing default="#fff" to some other color (note: the HTML color code #fff in this case contain only 3 alphabets {it can also be numeric}, but you can put either 3 or 6 alphabets or numerics or combination depending on what color you want, preview and see what changes you get. I have no interest, so I did not try.

IMPORTANT: It is always wise to backup your current template PLUS any Page Elements that can be backup before you tamper with the template. See Backup template PLUS Page Elements and edit template.

Peter Chen's nice graphic signature

Monday, November 05, 2007

eSnip Music Player in sidebar

I have previously published a post showing how to add an eSnip music player in a blog post at Add music to your blog another easy way using eSnip (click BACK button to get back to this page)
. The actual eSnip player was added to eSnip music player in a blog post.

A blogger ask how to fit the eSnip music player in a sidebar. I did a test and successfully fitted it into the bottom of the first left sidebar of Blogging Ideas.

You must first know the width of your sidebar. If you don't, you can get instruction in how to get them from How to find the width of your blog Header, main column (posts), sidebar (click BACK button to get back to this page).

Anyway this is a section from the template of Blogging Ideas:

.sidebar-wrapper {
margin-right: 14px;
width: 160px;
float: left;
background-color: $mainBgColor;
word-wrap: break-word; /* fix for long text breaking sidebar float in
IE */
overflow: hidden; /* fix for long non-text content breaking IE
sidebar float */
}

That tells me that the width of the sidebar is 160 pixels. The width of the eSnip music player must be 160 pixels or less. Now the script for a selected song from eSnip is:

<table bgcolor="#000000" cellpadding="0" cellspacing="0"><tr><td><embed quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" bgcolor="#000" width="328" height="94" src="http://res0.esnips.com/escentral/images/widgets/flash/esnips_player.swf" flashvars="theTheme=blue&autoPlay=no&theFile=http://www.esnips.com//nsdoc/357ad475-5da9-44c1-864a-df7c17d61d69&theName=Carnivore&thePlayerURL=http://res0.esnips.com/escentral/images/widgets/flash/mp3WidgetPlayer.swf"></embed></td></tr><tr><td><table cellpadding="2" style="font-family:Verdana, Arial, Helvetica, sans-serif; padding-left:2px; color:#FFFFFF; text-decoration:none ; ; font-size:10px; font-weight:bold"><tr><td><a style="color:#FFFFFF; text-decoration:none " href="http://www.esnips.com/CreateWidgetAction.ns?type=0&objectid=357ad475-5da9-44c1-864a-df7c17d61d69"> Get this widget </a></td><td style="font-size:7px; font-weight:normal;">|</td><td align="center"><a align="center" style="color:#FFFFFF; text-decoration:none " href="http://www.esnips.com/doc/357ad475-5da9-44c1-864a-df7c17d61d69/Carnivore/?widget=flash_player_esnips_blue"> Track details </a></td><td style="font-size:7px; font-weight:normal;">|</td><td><a align="center" style="color:#FF6600; text-decoration:none" href="http://www.esnips.com//adserver/?action=visit&cid=player_dna&url=/socialdna"> eSnips Social DNA </a></td></tr></table></td></tr></table>


The width of the eSnip player (highlighted in red) is 328 pixels, and this is much too wide for the sidebar. I thus changed the width to 160 pixels (it can also be less, but not more), but left the height as 94 pixels. You can change the height of the player as well, but I wouldn't advice it. The edited script ended up as:

<table bgcolor="#000000" cellpadding="0" cellspacing="0"><tr><td><embed quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" bgcolor="#000" width="160" height="94" src="http://res0.esnips.com/escentral/images/widgets/flash/esnips_player.swf" flashvars="theTheme=blue&autoPlay=no&theFile=http://www.esnips.com//nsdoc/357ad475-5da9-44c1-864a-df7c17d61d69&theName=Carnivore&thePlayerURL=http://res0.esnips.com/escentral/images/widgets/flash/mp3WidgetPlayer.swf"></embed></td></tr><tr><td><table cellpadding="2" style="font-family:Verdana, Arial, Helvetica, sans-serif; padding-left:2px; color:#FFFFFF; text-decoration:none ; ; font-size:10px; font-weight:bold"><tr><td><a style="color:#FFFFFF; text-decoration:none " href="http://www.esnips.com/CreateWidgetAction.ns?type=0&objectid=357ad475-5da9-44c1-864a-df7c17d61d69"> Get this widget </a></td><td style="font-size:7px; font-weight:normal;">|</td><td align="center"><a align="center" style="color:#FFFFFF; text-decoration:none " href="http://www.esnips.com/doc/357ad475-5da9-44c1-864a-df7c17d61d69/Carnivore/?widget=flash_player_esnips_blue"> Track details </a></td><td style="font-size:7px; font-weight:normal;">|</td><td><a align="center" style="color:#FF6600; text-decoration:none" href="http://www.esnips.com//adserver/?action=visit&cid=player_dna&url=/socialdna"> eSnips Social DNA </a></td></tr></table></td></tr></table>


I then sign into blogger.com (Dashboard) and click LAYOUT in the section for "Blogging Ideas", click "Add a Page Element" and chose HTML/Javascript. I pasted the edited eSnip script into the HTML/Javascript Page Element window and click "save changes". The Page Element for the eSnip music player appeared at the top of the first left sidebar of the LAYOUT. I hover the mouse over the new Page Element and the cursor changed to a cross. I dragged the new Page Element to the bottom of the first left sidebar in the LAYOUT, click SAVE at the top of the LAYOUT and you can see the result at Blogging Ideas (bottom of the first left sidebar at time of publishing).

The little test is successful in displaying the eSnip music player, but the PLAY button is very small. So if you don't mind that, then here you are. That is how to fit the eSnip music player into the sidebar. To see the difference, surf over to the two examples or go to eSnip music player in sidebar problem

Friday, November 02, 2007

Trouble shoot sidebar slide to bottom of page problem: An example

I have previously published two posts on the "sidebar slide to bottom of page" problem at Sidebar pushed to bottom of page: What to do? and Trouble shooting sidebar sliding to bottom of page problem (click BACK button to get back to this page). Problems like this are most frequent in Internet Explorer, but while they may not cause the sidebar to slide to the bottom of the page with other browsers like FireFox, they can cause other problems.

A blog reader recently asked for assistance for this problem and I thought it would be good to use his problem on how to go about solving the problem. His sidebar is at the moment at the bottom of the page and here is a screenshot of the cause of the problem:

cause of sidebar sliding to bottom of page

I have used the red error to show where his sidebar end, and the screenshot clearly shows the width of the "Favorite Songs" far exceeding the sidebar width. If I have access to his Blogger account, I will open the Page Element (widget) that had been added to display that "Favorite Songs" and also open the template editor to check what is the exact width of the sidebar. See How to find the width of the blog Header, main column (posts) and sidebar (click BACK button to get back to this page).


However, I have no access to his Blogger account, so I have to do the next best thing, that is, click VIEW > PAGE SOURCE in the menu bar at the top of the browser while at his blog. This is what the page source revealed:

#sidebar-wrapper {
display: inline; /* fixes a strange ie margin bug */
float: right;
margin: 0 3px 0 0;
width: 269px
color: #1c4676;
background: url(http://www.blogblog.com/thisaway_blue/bg_sidebar.gif) repeat-x left top;
}

The part in red tells me that the width of his sidebar is 268 pixels. Further down the page source is this script which is used to display the "Favorite Songs"

<h2 class="sidebar-title">FAVOURITE SONGS</h2>

<div style="text-align: center; margin-left: auto; visibility:visible; margin-right: auto; width:450px;"><embed style="width:435px; visibility:visible; height:270px;" allowScriptAccess="never" src="http://www.profileplaylist.net/mc/mp3player-othersite.swf?config=http://www.profileplaylist.net/mc/config/config_blue.xml&mywidth=435&myheight=270&playlist_url=http://www.profileplaylist.net/loadplaylist.php?playlist=18021445" menu="false" quality="high" width="435" height="270" name="mp3player" wmode="transparent" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" border="0"/><BR><a href=http://www.profileplaylist.net><img src=http://www.profileplaylist.net/mc/images/create_blue.jpg border=0></a><a href=http://www.profileplaylist.net/standalone/18021445 target=_blank><img src=http://www.profileplaylist.net/mc/images/launch_blue.jpg border=0></a><a href=http://www.profileplaylist.net/download/18021445><img src=http://www.profileplaylist.net/mc/images/get_blue.jpg border=0></a> </div>


There are 4 widths there highlighted in red (you will scroll horizontally to see the hidden one) and the problem here is I don't know which width to change. I would probably first leave the first one alone, and change the width of the other 3 so that it is equal or less than 268. If that still don't work, I will change the first width as well.

So now, all I can do is to refer that blogger to this post and hope he can solve his problem. As for you, I hope you have learned something about how go about solving similar problems.

Update 17 September 2010: A reader solved her "sidebar at the bottom" problem by reducing the number of posts in the homepage from 25 posts to 10. Each of those 15 posts was published individually (permalink) and was found to not have caused the sidebar to slide to the bottom. Thus the possibility of content in one or more of those 15 posts causing the sidebar at bottom of page problem was eliminated.

If you have many posts in your homepage and your sidebar is at the bottom of the page, you may want to try having less posts on your homepage.

Wednesday, October 31, 2007

Nice image signature for your posts using signature generator

Have a look at this post: Signing post with nice graphic signature. This is much nicer than the one I did (was mainly for demonstration purposess) at Sign post with image signature (click BACK button to get back to this post). That was done with the free free Ifanview photo edito (click BACK" button to get back to this page), this "live signature" generator produces almost hand-written like signature, and is obviously more attractive looking. I was planning to do a real hand-written image signature with Paint, but that would make a pretty scratchy signature unless you can control your stroke very well. I think I will leave that to the future, if ever.

Thanks to Amanda of Blogger Buster who created an easy to use image graphic signatue generator which she called "live signature" and using the wizard, by making a couple of choices, I was able to generate the graphic signature to put at the bottom of the post with very little fuss. When you are done with selecting your choices, you will end up in this page:

My Live Signature

First to the the "live signature" site and generate the graphic signature you like. You will end up with a graphic signature image. Right-click on the image and select "Save image as" and save it into your computer. Before you can use it, you have to upload it to the web, You can use the Free Image and Video Hosting. You will have to get the photo URL. The process of getting the photo URL is explain in the lower half of this post Uploading and manipulating images for Blogger (click BACK button to get back to this page).

Another way is to create a special post or a special blog for the purpose of hosing the image. Upload it in the usual way, view the post, click on the graphic image signature that you have uploaded. (see Graphic image signature: Test

You will be taken to a page containing only the graphic signature image. Click VIEW > PAGEB SOURCE in the menu bar and a new window will appear containing the page source. I will put the actual page source in the scroll box below:

<html>
<head>
<title>Peter+Chen+signature.png (image)</title>
<script type="text/javascript">
<!--
if (top.location != self.location) top.location = self.location;
// -->
</script>
</head>
<body bgcolor="#ffffff" text="#000000">
<img src="http://1.bp.blogspot.com/_jizoPL28qCY/Ryf8qw-QU2I/AAAAAAAAA5c/U4M6l_gxx6I/s1600/Peter%2BChen%2Bsignature.png" alt="[Peter+Chen+signature.png]" border=0>
</body>
</html>


The photo URL is highlighted in red. Copy this and preferably paste it into a Notepad file so you can get it anytime your like.

Then type at the bottom of the post the HTML for an image:

<img src="photo URL" alt="some text to describe the image" />

where the photo URL is what you see highlighted in red in the scroll box above.

Now if you don't want to have to go to the trouble of typing this image HTML each time you create a new post, go to SETTINGS > FORMATTING and at the bottom, you will have the POST TEMPLATE, a box for you to paste the abovve img tag into the box. Save the setting. After that, each time you create a new post, this img tag will automatically appear in your post editor. Just type your content above the img tag.

Sunday, October 28, 2007

IP Address Ban Don't work Anymore

(see update below)

I have published a post How to ban IP address (click BACK button to get back to this page) and in its original version, tested to work. However, I do not have any IP address I would really want to ban, so didn't implement it for any of my own main blogs. However, a blog visitor commented that he couldn't get to the original site I used to generate the code to ban IP addresses. I checked and it was true, so added an update. Later, that site went offline, then online, then offline. I had to put up more than one updates. Then another blog visitor commented that that the site is online, but goes to a different address. The new address is

http://www.toolator.com/

Apparently, the site owner or owners have added more applications, of which IP ban is only one. You have to click on a link "IP Address Blocker" at the above site to get to

http://www.toolator.com/generators/ban/

This is the screenshot from the above site, after I have added my own IP address to ban so that I can test:

Generate script to ban IP address

If you click on the above screenshot, you will be able to see everything more clearly, including very faintly, my current IP address (mine is a dynamic IP address, which means it is not the same all the time. I may get another IP address if I switch off the modem, switch it on again to get back online) which is displayed faintly in red beside "Don't ban your own IP address:" My current IP address is

60.49.68.218

Today, I got another comment, asking how to add the URL to redirect the person(IP address) we want to ban. As I haven't tested the new site yet, I decided to test for my own blog Natural Remedies. It didn't work. I went to

http://ipchicken.com/

to reconfirm my current IP address, and it was reconfirmed that the above IP address is my current IP address. If you want to check your current IP address, copy the above URL and paste it into your browser address bar (preferably in a new tab with a browser like FireFox so that you do not need to lose this page.

I decided to test it for another of my blog Health is Wealth, and reconfirmed it didn't work.

The above 2 blogs use the New Blogger template, so I decided to test it on a blog Blogger old classic template store, added it direct to the template rather than through the LAYOUT as in the cases above, and it still didn't work.

I will have to do some further checking and will either add an update here or do a new post plus add a link to that new post here if there is any fresh development.

BTW, the latest question from the blog visitor was how to add the URL to redirect the person (IP address) we want to ban. (The IP address ban is not an actual ban but a redirect to another site that we ourself can specify). The original test was done a long time ago, so I cannot remember exactly, but vaguely remembered there was a way to add the URL of the site we want to redirect traffic from the IP address we want redirect to. However, when I did this test, there was no way for me to do that, so I assumed that the site to be redirected to would probably be that of the application creator. But as my test showed, it just didn't work. So you just have to be patient while I try to work this out.

In the meantime, if you happen to be reading this post and want to ban an IP address or you want to test it for yourself, I would very much appreciate you let us (me and this blog readers) know about your experience by adding a comment.

Update 29 October 2007: Got a response from the creator of this IP Address Ban who says he is having problems with his current webhost which I will paste verbatim below:

"The next couple of months I`m going to work on a new system on another webhost. So I hope to offer somewhere in the month January 2008 a new ip-blocker service. Maybe with some extra futures."

Saturday, October 27, 2007

Sign post with image signature

Here are the instruction on how to sign your post with an image signature. You can see a demonstration at Papaya: Healthy and cost effective fruit. The signature is in text form, but it can be "hand written" as well. Instruction for this will follow later.

I first used the free and very good Irfanview photo editor (click BACK button to return to this page) to create a blank image. Once Irfanview is opened, I click IMAGE > CREATE NEW (EMPTY) IMAGE in the menu bar at the top, set the width and the height of the image, choose the background color, then click OK. In the newly created image, I drag and drop the mouse to make a selection where I want my signature to be displayed, click EDIT > INSERT TEXT INTO SELECTION, type my signature, tick "transparent if I want the text to be transparent or select the background color for the text otherwise. Select the font family and font size, select text alignment (left, center, right), then click OK. If you find it unsatisfactory, it is very easy to change. All you need to do is to repeat the steps above, all the original settings and text will still be there, change what you need and click OK again. Once satisfied, save the signature image into your computer.

You will next have to upload the image signature to the web. There are many ways to do that. What I did is to create a new post in a blog specially for this purpose, and you can see the image signature uploaded at Signature image for blog post. I clicked on the signature image which gets me taken to a web page containing only the image. I then click VIEW > PAGE SOURCE which will cause a new window to open, displaying the source code for that page. I past below in the scroll box the source code I obtained:

<html>
<head>
<title>signature.jpg (image)</title>
<script type="text/javascript">
<!--
if (top.location != self.location) top.location = self.location;
// -->
</script>
</head>
<body bgcolor="#ffffff" text="#000000">
<img src="http://1.bp.blogspot.com/_jizoPL28qCY/RyKczA-QUzI/AAAAAAAAA5E/NJbyc1vY8Dw/s1600/signature.jpg" alt="[signature.jpg]" border=0>
</body>
</html>


The photo URL is highlighted in red. I click and drag the mouse over the URL, right-click and chose "copy" (or ctrl+C) to copy into the clipboard. My habit is to open a Notepad file and paste it there so I can always get it when I want.

I then type the HTML for an image at the bottom of the post. The HTML will be of the form

<img src="photo URL" alt="some descriptive text" />

The photo URL will of course be replace by the actual photo URL highlighted in the scroll box above. Preview, and if satisfied, publish.

I put the actual HTML to display the image signature in the scroll box below:

<img src="http://1.bp.blogspot.com/_jizoPL28qCY/RyKczA-QUzI/AAAAAAAAA5E/NJbyc1vY8Dw/s1600/signature.jpg" alt="image signature" />


Once you have created this HTML, you can have the HTML in every new post you create by clicking the SETTINGS > FORMATTING tabs, paste the HTML into the post template at the bottom and save the settings. You then don't need to retype the HTML each time you create a new post.

If you want a hand written signature, you will have to use Paint that comes with Windows under Accessories. I will add instruction later or more likely make a new post and put the link to that post here.

Printing your blog

Printing your blog with BlogCollector

Some of you might be interested in having your blog in hard copy, that is, you may want to print your blog. Here is one way you can do that. Type "BlogCollector" into the search box above, tick the radio button beside WEB and search. You should get the link to download BlogCollector in the very first result.

There are 5 versions, BlogCollector Lite, BlogCollector Standard and BlogCollector Professional. BlogCollector Lite is free, which is the version I have, you can backup your Blogger blog provided you use a standard Blogger template, especially the Minima tmeplate, or you use a template which have not been edited too extensive. For blogs with certain template, BlogCollector may not be able to backup your blog. This blog uses a New Blogger 3 column template modified by Ramani and I have successfully backup this blog PLUS turned it into a PDF which you can print. You can download the PDF file at PDF version of award winning blog, Blogger Tips and Tricks. However, make sure you read the added notes or updates.

BlogCollector Lite my be free, but there is a maximum (limited) number of entries you can backup and and maximum (limited number of pages you can export export into PDF file. With BlogCollector Standard (not free), you can also export it as RTF (Rich Text File) or as HTML plus support backing up unlimited number of blogs and unlimited number of blog entries. BlogCollector Professional (the most expensive) support any paper size - letter, A4, customized, has better HTML conversion, support images in PDF, support re-publishing of blog entries to new blogs, there is no BlogCollector header/footer, you can export in PDF, HTML and RichText formats, PDF encryption such as password protect, copy protect, print protect, etc., give you flexible layout control such as countinuous entries, or each entry in a separate page.

Once you have exported into a PDF RTF file, you can print the whole blog. If you export it as a HTML file, you can view the file in a web browser like Internet Explorer, FireFox, etc. However in this case, if you want to print the blog, you can only print page by page.

Printing a page of your blog without any additional software

HP has provided a way for you to add a "Print this" (or anything you want) at the bottom of the page which a visitor can click to print the page. Instruction for doing this is given in Add "Print This" option for your blog (click BACK button to get back to this page).

Printing blog and ink or toner usage

Now printing obviously uses up ink or toner, especially if your blog uses a black background or has lots of photos. Printers ink and toner are not cheap, especially if you buy original. I suspect many printers at sold at near cost or sometimes even below cost as once you buy their printer, you are practically locked as a customers for their ink or toner cartridges which the printer manufacturers sell at high price.

However, there is a way around that. You can get replacement cartridges at Inkers. You can purchase online cost effective compatible (generic)ink, inkjet cartridges, toner, toner cartridges provided for your printer, copier, multifunction or fax machine. To give you confidence, they even give a 100% guaranteed against defect for one full year plus have a thirty day no questions asked return policy. So if you change your mind, all you need do is to call at 800-848-7232 if the package is left unopened within less than 30 days and they will refund your money in full.

I see quite a lot of printer manufacturers represented there, the more popular ones are I believe Canon toner cartridges, my laser printer manufacturer HP toner cattridges and many more.

They also offers inkjet catridges like Epson Inkjet cartridges, etc.

For continental USA, they also gives free shipping ground delivery by UPS.

Friday, October 26, 2007

"Add to Any" social bookmarking: Making your own button

I have previously publish an easy method to put a button on your blog for your blog visitors to bookmark your blog at Easy social bookmarking for your blog using "Add to Any" (click BACK button to get back to this page).

A blog reader asked if it is possible to use her own button for the "Add This" bookmarking button. I had a look at the script and saw that it should not be a problem and did a test/demonstration at Health is Wealth. Click on the "bookmark this" button and see what happens.

The demonstration button, done with a free photo editor, Irfanview (click BACK button to get back to this page).

What I did was this. I opened Irfanview (click BACK button to get back to this page), click IMAGE > NEW (EMPTY) IMAGE, then input the width and height of the button I wanted to create. You will have to input a width which is equal or less than the width of your blog sidebar. If you don't know, refer to How to find the width of the blog Header, main column, sidebar (click BACK button to get back to this page). You can select the background color of the new image. Next, I click and drag the mouse to create a selection, click EDIT > INSERT TEXT INTO SELECTION..., set the font size and color, background color, etc, type "Bookmark this" or any text you like, then click OK. If you want a more fanciful button, type "button generator" into the search box above, tick the radio button beside WEB and search. Find the button generator you like and generate your fanciful button. Or you can use more sophisticated photo editor like Photoshop.

The newly created button was saved into the computer, uploaded the button to Image for bookmarking website, click on the displayed button to get to the page where only the button was displayed, click VIEW > PAGE SOURCE in the menu bar at the top of the browser. A new window will open displaying the page source codes for the post. Below inside the scroll box is the page source I obtained:

<html>
<head>
<title>Bookmark+this.jpg (image)</title>
<script type="text/javascript">
<!--
if (top.location != self.location) top.location = self.location;
// -->
</script>
</head>
<body bgcolor="#ffffff" text="#000000">
<img src="http://4.bp.blogspot.com/_jizoPL28qCY/Rx9X77kbB0I/AAAAAAAAA48/f_b_s6dHlUA/s1600/Bookmark%2Bthis.jpg" alt="[Bookmark+this.jpg]" border=0>
</body>
</html>


The photo URL is highlighted in red. I click and drag over the photo URL, and my normal habit is to open a Notepad file, paste the URL into it so that I can get it anytime I want.

Below is the script for the "Add to Any" social bookmarking button:

<a href="http://www.addtoany.com/?sitename=Good%20Health%20Information&siteurl=http%3A//good-health-information.blogspot.com/&linkname=Bookmark%20Manager&linkurl=http%3A//good-health-information.blogspot.com/rss.xml&type=page"><img border="0" width="91" alt="Add to any service" src="http://www.addtoany.com/addbm-b.gif" height="29" title="Add to any service"/></a>


Again, the photo URL for the default "Add to Any" button is highlighted in red. I drag and drop the mouse over this photo URL to highlight it, click delete to get rid of it, then replace it with the URL of the button I created. So the new script become:

<a href="http://www.addtoany.com/?sitename=Good%20Health%20Information&siteurl=http%3A//good-health-information.blogspot.com/&linkname=Bookmark%20Manager&linkurl=http%3A//good-health-information.blogspot.com/rss.xml&type=page"><img border="0" width="91" alt="Add to any service" src="http://4.bp.blogspot.com/_jizoPL28qCY/Rx9X77kbB0I/AAAAAAAAA48/f_b_s6dHlUA/s1600/Bookmark%2Bthis.jpg" height="29" title="Add to any service"/></a>


So there you are folks. That is how I created my own button for the "Add to Any" social booking button at the bottom of the left sidebar (at time of publishing). I know it is not much of a button, and I am confident of doing better given time and the proper tool, or even with the same tool, make the button bigger. It is over to you. You can go make your own fanciful buttons and make it says anything you like, like for example "Bookmark this great blog. If you don't, it will be the greatest mistake of your life". Maybe I will do that later, because I think that is the truth for this blog (not that one which is a relatively lower traffic blog compared with this one).

Thursday, October 25, 2007

Free fonts for your blog

Are you not satisfied with the fonts that is available for your blog? If so, you may want to check out
http://www.virtualhosting.com/blog/2007/100-legal-sources-for-free-as-in-beer-fonts
100 Legal Sources for Free (as in Beer) Fonts. I have not tried it as I am not a big fan of fancy fonts and is quite satisfied with what I have, so I cannot vouch for what is available in that site. But if you like fancy fonts, give that site a try.

As to how to use it, if you don't know, ask, perhaps I will answer with another post. That is for the future

Tuesday, October 23, 2007

Blogger will like to take a break from blogging, but wondering if he really ever will

I have been blogging for years, often stuck in front of the computer nearly all my waking hours, and perhaps should take a break. I have been to Thailand, Indonesia, Belgium, Netherlands, France, United Kingdom, Germany, Switzerland, Italy and United States of America, but that was 20 to 30 years ago. I went back to Geneva, Switzerland, for the Geneva International Invention Exhibition a few years ago. Maybe it is time to do a bit of traveling again, and this time, for a real vacation.

Where should I go? Well, I understand that New Zealand is a pretty unique place. It was the last place on earth to be populated by human, do not have any man-eating animals, no snake (wonder if they have rats), and have some very unique animals, birds, fauna and flora. I would love to see that fierce looking Maori warrior sticking his tongue out at me. Plus I think I would enjoy the mild temperate maritime climate as a welcomed change from the hot and humid tropical weather in my country.

Auckland skyline by Beau Wade


The largest city in New Zealand is Auckland, in the North Island of New Zealand. Plus lots of events are hosted in Auckland year round. An example is the Waitakere World Junior Badminton Championships 2007 which will be held between 25 October - 4 November this year. My country, Malaysia, will be among the many teams from twenty-six countries competing for titles. Others include other Asian badminton powerhouses China, Korea and Indonesia. I should be there to cheer the Malaysian team to victory.

Then there is this interesting "The Pride of Auckland", world famous sailing and dining cruises with daily scheduled cruises, regattas, match racing and sailing events for groups of any size. There will be informative commentary on the sights of Auckland’s beautiful Waitemata Harbour by the crew. Not only that, guests are welcomed to help sail the yachts and as a bonus, guest gets free entry to the New Zealand National Maritime Museum. And the cost? From $48.00 per person only.

But I am, sad to confess, a cheapskate. I use all free tools like the free and very good Irfanview photo editor (click BACK button to get back to this page) together with Paint that comes with Windows for the screenshots for my blog. I use blogspot.com exclusively for all my blogs and never use custom domain. For reasons, have a look at Why I never use New Blogger custom domain. For photos for my posts, I either use my own photos or those photos uploaded to Flickr under the Creative Commons license (I would of course give attribution to the source plus inform the owner of the photos). The above photo is an example and as soon as I have published this post, and have the post URL, I will inform Beau Wade about this post.

I use the free BlogColletor Lite to make a downloadable PDF file of my blog to sell for $1.99????? at PDF book Blogger Tips and Tricks for sale online. Didn't expect to sell any, but to my surprise, I sold one!!!! If you want the story, you will have to surf to my "e-Commerce" post above to read about it. Hope you will buy one too, but read the update carefully.

Now knowing my cheapskate nature, don't be surprised that if I really take a break from this addictive blogging hobby, I would go for Auckland Accommodation which gives a Lowest Rate Guarantee. The guarantee says that if I can find a rate lower than the best available Internet rate on another web site for the same hotel/accommodation on the same dates, all I need to do is to inform them within 24 hours of booking and we will honor that rate for the night(s) for which the lower rate was found and refund me the difference. Now for a cheapskate like me, that is very comforting.

I may even go extreme and go for Auckland Central Backpackers. After all, I bought Peugeot alloy light-weight racing bike from the flea market for a song when I was in Geneva for the Geneva International Invention Exhibition, stayed in a caravan by the Geneva lake far from the city center, cycled around Geneva and saved enough on bus fares to cover the cost of the bike, spent less than what I was given and took home a bonus plus had a real jolly time. If I can do that in Geneva, I may be able to do something like this in Auckland too. Only trouble is, no one is going to sponsor me for my proposed break from blogging in Auckland. Any offers?

Changing fonts and colors for New Blogger

Update: Use the new template designer to change font instead. Login to Dashboard > Layout and click the template designer at the top right corner of the page.

It is now very easy to change the fonts and colors of various things in your New Blogger blog. You don't need to tamper with the template. You can do it direct from the LAYOUT.

Sign into blogger.com (Dashboard). You will see a list of all your blogs. Click LAYOUT for the relevant blog. Then click the FONTS AND COLORS sub-tab. See screenshot below:



Say, you want to change the font for the Header. Scroll down till you see "Page Header Font". On the right, you will have the radio button to chose the font family and further to the right, you can change the font style to bold or italic. There are also linls to change the font size to "bigger" or "smaller"

Monday, October 22, 2007

Make active (clickable) links in posts and comments

I am quite sure I publish a post on this subject before but just can't seem to find it, so doing it again. You can find out how to do it at How to make a clickable link, but that is a long post and include using the tool bar in the Blogger post editor, with the information on the HTML for hyperlink at the bottom of the post, I think.

This post will just focus on HTML for hyperlinks and is for everybody, not just Blogger users. This is how you should type your HTML:

<a href="URL of target site">anchor text</a>

If you are not familiar with URL, go to
What is URL and how you can get it.

The word "anchor tex" is a description (the title of a blog, post, anything you like) and is what will be displayed on a browser. For example, the HTML for the hyperlink to the precursor of this blog should be type as

<a href="http://bloggerfordummies.blogspot.com" target="_blank">Blogger for Dummies</a>

and in a browser, will appear as

Blogger for Dummies

UPDATE: Attributes like target="_blank" are not allowed in comments. Only a limited numbers of HTML tags are allowed in comments including <a> <b>, <i>

"Blogger for Dummies" is the anchor text and is important for the search engine uses it to figure out what is the target site (the site you are linking to) is all about. People who practice SEO (Search Engine Optimization) try to put suitable keywords (words surfers are likely to use to search for content) in the anchor text.

You may notice an extra target="_blank". This is to make clicking on the link open a new window. You can also use target="new". However, the use of target="_blank" has been deprecated. It still works, but we don't know about the future.

Sunday, October 21, 2007

Centering photo, search box, etc.

Previously, the way to center something is to use the <center< tag. That has been deprecated and its use is not encourage (It will still work though, but we don't know about the future).

Now if you want to center something, you must use inline style sheet. You have to surround the "something" with <div style="text-align:center;"> and </div>

That is, you have to type it as

<div style="text-align:center;">somthing</div>

Friday, October 05, 2007

What to do with comment spam

I am sure you have got bloggers putting irrelevant comments in your posts plus links to their sites. I will show what I do when I get such comment spam.

1. I set comments to only registered users (meaning they must have a Blogger account)

2. I moderate comments, and thus have a permanent record of the comments in my Inbox together with the spammer blogger profile.

2. I use Yahoo email address to receive comment moderation email notification and set the option to display full header (giving details of IP addresses, etc).

To set Yahoo to display full header, click "Options", "General Preferences", then in the "Messages" section, tick the radio button beside "Show all headers on incoming messages"

3. Highlight all the information the the header and copy to clipboard.

4. When I get a comment spam, click the down arrow in "Forward" and select "As Inline Text", type "Reporting comment spam. Full header:" then paste the full header into the message.

5. Add "Reporting comment spam" in front of the message subject

6 Forward to abuse@blogger.com

Amazon products on spam

I have done this a few times, and hope Blogger support have the time and/or willingness to stamp this spamming out. However, I have not received any feedback from them after reporting comment spam. However, I have reported email spam to abuse@yahoo.com, abuse@gmail.com, abuse@hotmail.com and have got positive responses.

If you are using Gmail, to get the full header, at the top right of the page, click the down arrow beside "Reply" and chose "Show original" and the full header will be displayed. See screenshot below:

Gmail display full header

Wednesday, October 03, 2007

Can I have a blogspot URL that is long not updated or without any post?

This question comes up very often and in fact I just got one. A blogger tries to get the blogspot.com URL he wanted, but someone has already taken it but has not updated it for long time or may even not have made any post at all. Question is, can he have the URL? Short answer at the bottom of post, in red.

Long answer:

1. According to Blogger policy, blogspot URL do not expire. That means theoretically, they are forever. However, if it has been identified (rightly or wrongly) as a spam blog, there is a possibility that the blog will be deleted and the URL becomes available again and then you can have your go for the URL.

2. According to Gmail policy, if there is no activity on your Gmail account for 9 months or more, your Gmail address can be deleted. If you use that Gmail address as the username for a Blogger account, and it has been deleted, it is likely that the same may happen to your Google account together with the blogs (this may also apply to the blogger whose URL you want).

Amazon products for Blogger

But what if the Blogger account is started with a non-Gmail email address like, for example, Yahoo?

Yahoo, when it first started, says their email addresses are for life (what exactly "for life" is up to you/them to interprete). Now when you start a Yahoo email address, that message no longer appears, so I don't know what are their current policy is. However, if you don't sign into a Yahoo email address, it will be deactivated. I am guessing that if you use a Yahoo email address for your Blogger (Google), you have less chance of getting your Blogger (and Google) account getting deleted, together with the blogs.

I am testing what are the actual effects of all these mentioned at Will Blogger blogs ever be deleted?. The results wouldn't be known for some time.

So if you are eyeing a particular blogspot URL, if for any reason the blog is deleted, you can have a go at the URL.

Other possibility is to try to contact the blog creator and ask if he or she is willing to release it to you. Unfortunately, frequently, the profile in not made public, and even if it is made public, they may have chosen not to display their email address. In this case, you have no recourse.

But you have alternatives. You can become creative and alter the URL a little bit. For example,

http://bloggerfordummies.blogspot.com

is already taken (by me), but your can try

http://blogger-for-dummies.blogspot.com

which may even be better because according to WebCEO, search engine cannot distinquish between words made into a compound word, but they can if you separate them using hyphen. This can be good for SEO (Search Engine Optimization) as the URL is given high weightage by search engines according to WebCEO. Further, if you jumble many words into a single compound word, you may end up with something that may convey a meaning very different from your original intention, some of which can be very embarrasing. You can find some funny examples in Webmasters who didn't think when they registered their URL.

Note that using hyphen in URL is controversial, and I am hoping to find the time to research the subject further. Also check the comments to read what Jan had to say about hyphen in URL

You can also try adding an extra word to an already taken URL. For example,

http://health-information.blogspot.com/
may be already taken, but you can try


http://good-health-information.blogspot.com/


If you are creative, there will always be a way around a problem.

BLOGGER WILL NOT HELP YOU GET A LONG UNUSED BLOGSPOT URL

Saturday, September 29, 2007

Why I am looking for new tools for blogging

One can't blog out of a vacuum. To blog, one need tools. What kind of tools you need to have depend on how fussy you are and what kind of blog you have. The fussier you are, the more tools you will likely need. I make do with a computer, a wireless modem router, a UPS (Uninterpretable Power Supply), a webcam and head set plus a digital camera. You may make do with more or less, depending on what you want to do or how fussy you are.

What do you have and what do you need? I don't know. At the very minimum, you will need a computer and a modem to get access to the Internet. You may already have what is needed, but nothing is forever. Things can get spoilt or become obsolete, or you may want to upgrade to something better. For example, I try to do many things at the same time and often hates to close a window or a tab because I may need to come back to that window or tab later. That is why I use a browser like FireFox with Google toolbar> which have tab browsing.

I do multitasking and I normally have many tabs opened at the same time. Not only that, I normally have more than one browser opened simultaneously. Read why at Why you should have more than one browser. My son told me that I should use a computer with dual core, core 2 or duo processor.

I am thus looking at Coupon Chief where one can get coupons to get discount from many online merchants like Dell Home which practically everyone knows sell computers and related stuff. I already have some accessories like webcam and headset to make video, and my son have a compact digital camera which I can use, but do not like to use. Because of negative developments in my country which is making my country go from bad to worst, I have now become a sort of untrained reporter and journalist. These are two examples:

Parliamentary Roundtable to reaffirm that Malaysia is a secular state and not an Islamic state

Long march for Justice

I don't like my son's digital camera. Further, at the Long March for Justice, I was unable to take photos at the climax of the event because of (I think premature) low battery. That was the second time it happened. I am now thus looking to get my own digital camera and has started looking at Best Buy which not only list best buys, but I saw a couple of digital cameras listed there.

I also make videos with my webcam and headset (with microphone) with Windows Movie Maker which comes with Windows operating system. I am not quite satisfied with the features available and now thus looking at Computers and Software. Unfortunately, at the time I check, no video editor software was listed, but not all hopes are lost, for at the bottom of that page, I saw a long list of "All Computers and Software Stores" which will take time to check out. In the meantime, I will make do with Windows Movie Maker which is sufficient.

Tuesday, September 25, 2007

Scroll box for Labels (New Blogger)

A blog reader asked if it is possible to use a scroll box (click BACK button to get back to this page) for New Blogger labels (categories or tags). I did an example at Natural Remedies. It is in the right sidebar, second from the top (position may change as Page Elements are added, deleted or moved around). It is not automatic, but done manually, and each time you add a new label, you will have to add that to the list of links in the scroll box.

Here is how I did it. First, I go to Natural Remedies and scroll down to where I can see the Label List. I then opened a Notepad file, typed in a series of empty HTML hyperlink tags as shown below:

<a href=""></a>
<br />
<a href=""></a>
<br />
<a href=""></a>
<br />
<a href=""></a>
<br />
<a href=""></a>
<br />
<a href=""></a>
<br />
<a href=""></a>

The <br /> tag is to force a line break so that each label will appear on a separate line. The number of these HTML hyperlink tags should preferably be the same as the number of labels you have in the Label List, but it can be more. Excess can be easily deleted later. This task can be made easier by copy-pasting. Now I minimise Natural Remedies and the Notepad file and place them side-by-side so I can see the both the Label List and the HTML tags at the same time. I right-click on the first label and chose "Copy Link Location" (this is for FireFox. Different browser will word it slightly differently) to copy URL of the label page, right-click in between the quotation marks in the first HTML hyperlink tag, select "Paste" and the label page URL will be pasted in between the two quotation marks. I then click in between >< and type the name of the first label, so in the above example, I will end up with the first two lines as

<a href="http://foodasmedicine.blogspot.com/search/label/adsense">AdSense</a>
<br/>


I then repeated with the second label, then the third and so on until I have come to the last label.

I have saved the HTML for a scroll box in my computer and I just locate it and opened it. The script I usually used is shown in below:

<div style=width: 395px; height: 100px; background-color: a0ffff; color: 000000; font-family: arial; font-size: 12px; text-align: left; border: 0px solid 00000; overflow: auto; padding: 4px;"></div>
Note the width and height of the scroll box highlighted in red. I used width: 395px; because the width of the main column (post) of my main blogs is 400px. The height can be adjusted to what you want. Now I am not putting the scroll box in a post (main column), but in the sidebar. The width of sidebar in that (and this) blog is 150px, so I will have to edit the width to 150px or less. In your case, if you do not know the width of your sidebar, refer to How to find the widths of the Header, main column and sidebar (click BACK button to get back to this page.

I then copy the list of HTML hyperlink tags from the Notepad and paste it in between ></div> of the scroll box HTML towards the end. To make it clearer I will show more of the scroll box HTML and show in red where I should paste the HTML hyperlinks for the list of labels from Notepad in red:

padding: 4px;">paste here</div>

I then sign into blogger.com (Dashboard) click LAYOUT for the relevant blog and click ADD A PAGE ELEMENT for the right sidebar and chose HTML/Javascript, paste the scroll box HTML (width and the height edited to suit your sidebar and the length of the scroll box you want) with the list of hyperlink HTML tags for the labels (from Notepad) into the HTML/Javascript box. In my case, I chose to type in "Scroll down to see topics" for the title of the Page Element (I am thinking of shortening it to "Scroll down for topics" to save valuable space), then click "Save changes". The new Page Element appeared at the top of the right sidebar in the LAYOUT. I hovered the mouse cursor over the new Page Element and dragged it down to where I wanted it. Having done that, I click "Save" at the top right of the LAYOUT and it is done.

If anything is not clear, point out what is not clear in the comment and I will try to make it clearer.

Note that each time you create a new label, you will have to add it to the list.

RELATED POST:

Scroll box FAQ

Thursday, September 20, 2007

Downloading and changing New Blogger template

A number of readers have been having problems downloading and installing templates from third party creaters and modifiers of New Blogger templates, so here is a post to explain the process.

Before I get to that, let me again repeat the importance of backing up your current template AND Page Elements before you change template. Refer to Backup New Blogger template PLUS Page Element and change template. This post will also show how to get to the template editor window.

Generally, 2 methods are offered. One, the one offered by Stavanger of Blogcrowd, gives the template which you have to copy and paste into the template editor window. For tasks like these, it is best you have a browser like FireFox which has tabbed browsing. Then you can be in the page with the new template in one tab and logged into Blogger in another tab in the same window.

In the box containing the new template, click inside the box, press ctrl+A (or right-click and chose "Select all") to highlight all the template, press ctrl+C (or right-click and chose "copy" to copy the new template into clipboard. Go the the Blogger template editor window, click inside the template editor window, press ctrl+A (or right-click on mouse and chose "Select all"). Press the DELETE key. The template window will now be empty. Click inside the empty template window, press ctrl+V (or right-click and select "Paste" to paste the new template from the clipboard into the empty template window. Preview, and if there is no problem, click "Save template.

In most cases, the template is downloaded and saved as an xml file. In this case, in the template editor, click "Browse" at the top of the page, navigate to where you saved the xml file, select it, click "Upload". When done, click VIEW BLOG to make sure everything is OK.

Any further problem, comment in this post and I may use your comment to make the above clearer.

Wednesday, September 19, 2007

Using Joomla for your blog

A blog can be created by either using blogging platforms like Google Blogger, Wordpress, Live Journal, Typepad, etc. With these blogging platforms, it is easy for someone, even one not familiar with HTML and other technical stuff, to easily start a blogs, often within minutes. This is especially true of Google Blogger which is one of the easiest blogging platform to use, especially with the switch from the old classic Blogger to the New Blogger which offers a ADD A PAGE ELEMENT (widget) and a drag-and-drop LAYOUT and a which will enable a blogger with absolutely no knowledge of HTML to customize the blog without having to edit the template.

Another way to create a blog is to use Content Management Systems if you want a full blown suite of web applications. There are a few popular Content Manage Systems, one of the more popular one is the free, open source Joomla. If you opt to use Content Management Systems like Joomla, be prepared for a steeper learning curve plus a need to pick up maintenance and design skills, and preferably knowledge of PHP and SQL too. However, that is what you will need if you want more than what the other blogging platforms like Google Blogger have to offer.

Google Blogger has made their blogs search engine friendly, but you will still need to so some Search Engine Optimization (SEO) to get free organic traffic from search engines. For blogs using Joomla Content Management System, Joomla SEO will be able to help in this aspect. They offer a free version available from September 1st to December 31st, 2007, but I am unable to find how to download and install it. All I can find is an SerrbizSEF installation guide. It offers less features, but you can upgrade for just $24.95 to get more features.

They even have case studies of companies that have successfully done search engine marketing (SEM) with their software and you are even allowed to contact their clients for reference checks.

Tuesday, September 18, 2007

How to solve comment moderation via email problem

Comment moderation via email for Blogger

If you opted for comment moderation for your blog, there are two ways of doing it. One is to moderate from the Dashboard. The other is to moderate via email. If you chose the second option, the first option is still available. This second option is a much better alternative because you get a permanent record of the of the comment in your Inbox, you can publish or reject direct from the email plus, very useful, you get a link to the post where the comment was made (see screenshot. Title of post which is a link highlighted by red ellipse):

Blogger comment moderation via email

If you moderate via the Dashboard, very important is to remember to click on "Post Name" to display the title of the post in which the comment was made (see screenshot below:

moderating Blogger comments via Dashboard

It is only after clicking on "Post Name" that the title of the post in which the comments were made are displayed:

title of posts in which comments were made displayed after clicking Post Name

It is such a simple matter for Blogger to make the post title displayed by default, without having to click "Post Name" as it is important if you have any intention of responding to the comment. It is easy to forget, and that have happened to me before. Once you published the comment, it will disappear from the Dashboard and you will not know which post to go to to respond to the comment. What I have been doing when I need to moderate comments via email is to highlight the post title, copy and paste it into a Notepad file. After publishing the comment, I will then have to click "Edit Posts" and paste the post title into the search box to search for the post. The funny thing is, I have pasted the whole of what I copied into the search box and the search came up empty. I have to delete some of it before the post turn up in the search. Strange.

Anyway, once you locate the post, click VIEW to go to the post and then you can respond to the comment there.

Some comments not receiving email notification for moderation

This have been going on for some time and I have been faithfully posting details of it to the Google Blogger Help group. Blogger Employee asked us to check the spam folder. I did and so far, have never come across a single email notification for comment moderation in the spam folder, but have got some emails from my blog readers which ended up there. So if you have tried to email me but didn't get a reply, I may have missed it when I check the spam folder.

I was using Yahoo mail. Thinking that changing to Gmail may make the task for Blogger to trace the problem, I changed it to Gmail. The problem still persist.

New problem. Email notification gives a funky format

Recently, a new problem surfaced. The email I received for comment moderation was in a funky format. See scroll box:

New comment on How to change the width
of the content and the sid....
MIME-Version: 1.0
Content-Type: multipart/alternative;
boundary="----=_Part_289_10079831.1189897613291"

------=_Part_289_10079831.1189897613291
Content-Type: text/plain; charset=US-ASCII
Content-Transfer-Encoding: 7bit

USMLE ROCKER has left a new comment on your post "How to change the
width of the content and the sid...":

thanks a lot chen. rounders 2 doesnt give seperate tags for each
sidebars. it gives a single tag only. so i cant have sidebars with
different widths in this template. I wanted to have an extra width in
my sidebar with ads. anyways, i can manage with rounders2. thanks again.

Moderate comments for this blog:
http://www.blogger.com/moderate-comment.g?blogID=26880688

Posted by USMLE ROCKER to Blogger Tips and Tricks at 9/16/2007
------=_Part_289_10079831.1189897613291
Content-Type: text/html; charset=UTF-8
Content-Transfer-Encoding: 7bit

<a href="http://www.blogger.com/profile/08969904823520344562">USMLE ROCKER</a> has left a new comment on your post "<a href="http://blogger-tricks.blogspot.com/2006/05/how-to-change-width-of-content-and.html">How to change the width of the content and the sid...</a>":
<br><br>
thanks a lot chen. rounders 2 doesnt give seperate tags for each sidebars. it gives a single tag only. so i cant have sidebars with different widths in this template. I wanted to have an extra width in my sidebar with ads. anyways, i can manage with rounders2. thanks again.
<br><br>
<a href="http://www.blogger.com/comment-moderate-confirm.g?blogID=26880688&postID=2656812332030611371&publish=true">Publish</a> this comment.
<br><br>
<a href="http://www.blogger.com/comment-moderate-confirm.g?blogID=26880688&postID=2656812332030611371&reject=true">Reject</a> this comment.
<br><br>
<a href="http://www.blogger.com/moderate-comment.g?blogID=26880688">Moderate</a> comments for this blog.
<font color="gray" size="2"><br>
<br>
Posted by USMLE ROCKER to <a href="http://blogger-tricks.blogspot.com/">Blogger Tips and Tricks</a> at 9/16/2007 </font>
------=_Part_289_10079831.1189897613291--


It was no longer in the format in the first screenshot, and I was forced to go Dashboard to approve and to respond to the comment, with its attendant problems. It was time consuming and I am already very short of time. (I found out later it is possible to moderate from that funky email but it is still less convenient and harder to read than in its original format).

How this problem of funky email for comment moderation got solved

One day, I received an email for comment moderation in my Yahoo mail for a very low traffic blog. It was in the original format and very easy to use. I immediately reset my main blogs to receive email for comment moderating to the Yahoo mail, and now the problem is solved. No need intervention of Blogger Support.

Sunday, September 16, 2007

Change font size of blog footer

I did a test blog Test Footer Font Size. Note the size of the fonts in the footer.


The instrutions below will involve scanning through long line of codes in a template. See section on how you can find code easily at the bottom of the post if you have difficulties. Also, before you do anything to the template, always backup your template PLUS the Page Elements. See
Backup New Blogger template PLUS Page Elements and change template

Backup New Blogger template PLUS Page Elements and change template

Amazon computer products




To change the footer font size, sign into blogger.com (Dashboard). Click LAYOUT for the relevant blog, then under the TEMPLATE tab, click the EDIT HTML sub-tab. Look for block of codes that may look something like this (the exact code will depend on template. The one below is for the Blogger Minima template):

#footer {
width:660px;
clear:both;
margin:0 auto;
padding-top:15px;
line-height: 1.6em;
text-transform:uppercase;
letter-spacing:.1em;
text-align: center;
}

Just add a line

font-size: 400%;

so that the block of codes become

#footer {
width:660px;
clear:both;
margin:0 auto;
padding-top:15px;
line-height: 1.6em;
text-transform:uppercase;
letter-spacing:.1em;
text-align: center;
font-size: 400%;
}

Preview and if everything seems OK, click "Save template".

NOTE: The font size can be in % or px (pixels). You may also use 250% or 18px. Experiment, preview until you get what you want before you save the template.

How to easily locate the code you are looking for

To make your task of scanning the long lines of codes in the template, press ctrl+F and a Find [ ] will appear at the left of bottom of the browser. Tpye all or part of the code you are looking for and the scrollbar will scroll down to the part where the code is located and highlight it. See screenshot below:



Do all the necessary editing and preview. If everything seem OK, click "Save template" and VIEW BLOG" to ensure everything is OK

If this method don't work, click on the inside of the template editor window and press ctrl+A (or right-click and chose "Select all") to highlight all the template. Click ctrl+C (or right-click and chose "copy") to copy the template into clipboard, open a Notepad file, click ctrl+A again (or right-click and chose "Select all"), then click EDIT > FIND in the menu bar of Notepad at the top (or press ctrl+F), and in the "pop-up" FIND box, type or copy all or part of the code into the box and click "Find Next" and again the code you are looking for will be located and highlighted (see screenshot below):



Do whatever editing you need to do, then press ctrl+A (or right-click and chose "Select all") to highlight all the edited template in Notepad to copy into clipboard. Go back to the template editor. The whole unedited template should still be highlighted. Click the DELETE key and the template editor window will become empty. Paste the edited template into the empty template editor window, preview, then save.

Find help, info, instructions, tips, tricks

Tip: Use search box below or this box, labels in the first right sidebar, archive, ctrl+F for this page or sitemap to find topics