Thursday, October 26, 2006

Bug in moderating comments via email in Blogger Classic and Blogger Beta

Today, I made a very disappointing discovery when I tried to answer a query from a member of Google Blogger Help group. I always moderate comments via email, and have been receiving notifications regularly. When I moderate comments via email, I have the advantage of having a link to the post in which the comment was made, so I can easily respond to the comment if needed. There are 3 choices in the email notifications - Publish, Reject, Moderate. I have practically click on the Publish link all the time, and only occasionally click on Reject. I have never tried clicking on Moderate.

The question was, is it possible to edit comments? I though it might be possible by clicking on Moderate, and I said I will test it. I checked for comments to moderate, and it so happened that the only email notification for comment moderation was for my beta blog. I clicked on Moderate, and to my surprise, I was taken to a page with a long list of comments waiting to be moderated, with the one in the email right at the top of the list. I never receive any email notification for those comments below the first one in the list. This means not all comments will cause an email to be sent to me for moderation.

Update 2 Febuary 2008: I have been feeding Blogger with details of this problems for a long time and the problem still persists.

In that list of comments waiting for moderation, there was no choice for editing, only publish or reject. And not only that, there was no way of telling in which post the comment was made, and this make it hard for me to respond to the comment. I made a post about this problem in Reporting difficulties in moderating comments in Blogger Beta (close new window to return to this page). I decided to check on my classic blogs, starting with this one. In case any of you don't know how to moderate comments from the Dashboard, I am putting a screenshot below:
moderating Blogger comments in the DashboardIn the POSTING tab, you will see a sub-tab "Moderate comments". I clicked on "Moderate comments" and found a list of 51 comments waiting to be moderated dating back to July if I remember correctly. I never realise this as I had been receiving email notifications regularly, and never knew that for some comments, no email notification were sent. It was a lot of work checking the comment one by one and publishing them. Worst, I wouldn't have time to check through all my post to respond to them. So if your comment was late in getting approved, and didn't get a response, please forgive me. Blame Blogger.

I have notified Blogger support about the problem, and have also made a suggestion that they make it possible to navigate to the post where the comment was made when you moderate comments from the Dashboard. I hope the bug get fixed quickly, and that my suggestion will be acted upon. In the meantime, my advice for those moderating comments via email, do log into the Dashboard and try moderating comments from there. You may find some comments waiting for you to moderate without you knowing about it.

Update March 16 2007. Ron (Rat) and Sandra pointed out something I missed in moderating from the Dashboard. Above the list of comment/s to be moderated is this:

Unreviewed Comments (Sort: Post Name, Comment Date)

You can actually get the title of the post where the comment was made by clicking Post Name. However, this disappear after you have approved the post, and you have to have sharp memory or you have to write it down somewhere if you don't want to lose the ability get to the post to respond to it. In any case, I much prefer modearating from email as there will be a direct link to the post to enable one to respond to the comment.


Wednesday, October 25, 2006

How to delete comments

Update: Consider also this Delete comment utility

Most Blogger bloggers will already know this, but someone asked, and I thought I might as well answer it in a post. Further, I followed the usual way, and failed. So I think it would be good to make a post, plus description of what to do if that failed.

To delete a comment, first make sure you are signed into your Blogger account. Then go to that post and in that comment you want to delete, at the bottom you will see a trashcan icon. Just click on the icon and confirm that you want the icon to be deleted and it will be done.

Now, that was what I did when I wanted to delete a comment, but for some reason or other, I could not see the trashcan icon. I tried a few times in a few browsers, and still could not see the icon. I tried to first help myself as described in my post How to contact Blogger support (click "Back" button to get back to this page) and found myself being taken in a merry-go-round that eventually lead to a suggestion form to improve Blogger Help, but with a message that I will not get a reply. I then tried 2 methods to contact Blogger support (described in the post above) and not sure which one got me a quite quick response from Blogger support:

"Thanks for writing in. If you're unable to see the trash icons for comments on the post page, you can go to the posts' comment page instead. There, you should be able to find the trash icons. I apologize for the inconvenience."

I (already logged into Blogger) click the month in which the post appeared in the Archives in the sidebar and was taken to a page with all the posts of that month including the post in which I want a comment deleted. I then click on "Comments" at the bottom of the post and got to the post's comment page. There, I finally saw the trashcan icon, click on it, confirmed, and the comment was deleted.

Footnote. The reason why I needed to delete that comment was the person posted a long unbroken line (unclickable link) which caused the sidebar in that individual post page to slide to the bottom of the page in IE. I didn't realise this for a long time as I normally used FireFox (close new window to come back to this page). My recommendation to every blogger is to frequently check your blog in IE for problems like this if you normally use other browsers for your surfing.


Tuesday, October 24, 2006

Using Irfanview photo editor for Blogger blogs

Irfanview is a very good free image editor which can be very useful for bloggers working with images. I used it very frequently especially to edit and upload screenshots to my posts. You can get Irfanview by googling for "download irfanview".

What and how do I use Irfanview for my blogs? Well, very frequently, I need screenshots to better explain what I want I have in mind. (I refer to screenshots below because I mainly work with screenshots. The same methods apply to photos, etc.) To do that, in the particular page, I press the key Printscreen, open Irfanview, click Edit in the menu bar and choose Paste, and the screen image appear in its editor window. With this method, the cursor will not be displayed. If I want the mouse cursor to be shown on a particular spot to draw attention to it, I first go to the screen I want pasted, go to Irfanview, press C, and a pop-up will appear. I select the relevant options, make sure "Include mouse cursor" is ticked, click start and I will be taken to the previous screen. I then press ctrl+F11 (the key is configurable, but F11 is the default. It can be changed but I have no reason to change it), and I will be taken back to Irfanview with the screen in the image editor window with the mouse cursor in the spot where I last left it.

I can also highlight a spot by drawing a circle around it. Unfortunately, Irfanview does not have that feature. For that, I have to use Paint which comes with Windows (under Accessories)


If I want only a particular section of the screen of the screen to be included, I drag and drop the mouse in that section. a broken-line box will surround the section. I click on Edit in the menu bar and select "Crop selection" and the rest of the screen will disappear, leaving only the section. I then save the file, usually in jpg format (there is a huge selection of formats to choose from in Irfanview). I then upload the screenshot into the post.

Add text

If I want text to be displayed in certain section of the screnshot, I drag and release to highlight that section of the screenshot I want the text to be displayed, click Edit in the menu bar, select "Insert text into selection", a pop-up will appear with a box for me to type in the text. There will be other options such as choose font, alignment left, center or right, etc. When I am finished, I just click OK and the text will appear in the screenshot.

Highlighting particular section of the screen with Paint

When I want to draw attention to certain section of the screen, such as putting a circle or a rectangle around a section of the screenshot, it unfortunately can't be done in Irfanview. I first save the file. I then open Paint available in the Accessories section of Windows. I open the file in Paint. I first select the color of the ellipse I want it to be, usually red by clicking on the square of color in the palette at the bottom of Paint. Then I select the icon for ellipse in the toolbar on the left side of Paint. I then drag and drop the mouse over the section I want to highlight, and an ellipse will surround that section. To see an example of a screenshot with a portion of it highlighted by a red ellipse, surf over to Generating simple graphic header using Irfanview photo editor (click "BACK" button to return to this page). If I am not happy, I click Edit in the menu bar and select Undo, and the ellipse will disappear. I repeat again until I am satisfied. I then save the file (the default format in Paint is bmp. I normally change it to jpg). The screenshot is then ready for upload to the post.

Resizing image size

Frequently, we have to resize images so that they will fit into the space we want them to display, etc. This can very easily be done in Irfanview. In Paint (which I seldom use) the choices are to resize in percentage, which can be problematic if you need the width to be in exact pixels. In Irfanview, just click Image in the menu bar and select Resize/resample, and a pop-up will appear. There are many choices (pixels, cm., inches, percentage). You can see the choices in the screenshot below (click to enlarge):
Irfanview photo editor: resize image
If, for example, you want to resize the image so that the width do not exceed the width of the column, enter the pixels into "width", leave the "height" alone and tick "Preserve aspect ratio". The height will be automatically set to keep the image from being distorted. You can then either save the image to be uploade in its original size or just use the figures in the width="" height="" attributes in the <img> tag. (Note: if you are using the <img> tag, you only need to enter the attribute width="X". If the height attribute is left out, the resulting image will automatically be scaled so as to keep the aspect ratio constant).

Save or convert picture into many different formats

With Irfanview, you can save or convert your picture into very many different formats. I am using the Irfanview 3.98 version. There are already a few upgrades which I didn't bother with, and I wouldn't know if there had been any changes in the number of file formats. For the version I have, there are altogether 19 choices which I list below:

Irfanview 3.98

bmp Windows bitmap
ecw Enhanced compressed wavelet
emf Enhanced Windows metafile
fsh EA Sports format
gif Compuserve gif
ico Windows icon
jp2 JPEG 2000 format
jpg JPEG files
jpm JPM format
ldf LuraDocument format
lwf LuraWave format
pcx Zsoft Paintbrush
pbm Portable bitmap
pgm Portable graymap
png Portable Network Graphics
ppm Portable pixelmap
raw RAW image data
tga Truevision Targa
tif Tagged image file format

The ico format will be useful if you intend to add a Favicon for your blog.

Related post:
Generating a simple graphic header using the Irfanview photo editor (click "BACK" button to return to this page).

How to put a copyright notice into your photo


Monday, October 23, 2006

Blog hijack, how to protect yourself.

Recently, I have been reading many reports of blogs being hijacked on the Google Blogger Help forum. Nitcrutz (Chuck) wrote a good post on it: Is your blog gtting hijacked through your computer
Stolen Computers
(close new window to get back to this page).

Among many recommendations is to strengthen your password. I have since done that. Fortunately I have a way of creating long password with numbers mixed. I would like to disclose the method I use, but that would be exposing myself, so you will have to find your own way. The only thing I feel safe talking about is it consist of 3 parts which are easy for me to remember. Also, I am mullti-lingual. Hope these hints helps you. The only drawback is the hassel of remembering long password (which in my case is not difficult) and to have to type in long password. I have changed the gmail account password as well as the Google account password (I thought they share the same password, but they don't) for my beta blog. If you want further information about creating strong passwords, have a look at this article: Strong passwords: How to create and use them (close new window to return to this page). Another site on creating hard to guess password: Choosing good password (close new window to get back to this page).

Amazon computer products

Another safe surfing tactic you may want to use is to install 2 or more user accounts for Windows, one with administrative rights which you use only when you need to install software, and the other non-administrative for general surfing. For me, unfortunately, I have a habit of having 3 browsers opened simultaneosly, and I have not figured out the way to install Opera such that it is also accessable for non-administrator users, so I am sort of forced to use the administrator account most of the time. When I find out how to install Opera for all users, I will begin to follow my own advice.

To Change your Blogger or Google password

Sign into (Dashboard). On the top left, under EDIT PROFILE, click "Accounts". In the next page, there will be a long list of Google services, which all uses the Google account. Click "change password". Type in your current password. Below, there will be 2 boxes to type in the new password. They must match.

Note: This will change the password to all Google account related services such as Gmail, Google analytics, etc., but not your Google AdSense account.

To protect your hardwork and prevent headaches, do read Chuck's articles: The real Blogger Status (close new window to get back to this page).

Update 29 November 2006: Looks like having Norton Securities and strenthening my password from 10 characters to 15 didn't help. My Blogger account was hijacked and all (except one of which I am only a team member wasn't listed in my Dashboard, and all the blogs were redirected, for me to, for others to other sites. Do read Chuck's articles if you want to protect yourself. Meanwhile, Chuck is trying to figure out how the hijack happened. Blogger employee helped to restore access to 2 of my blogs. It must have something to do with the template as changing the template removed the redirects. How the bad guys got into Blogger's templates we still can't figure out.


Friday, October 20, 2006

This is the individual post (not main page) that should show by clicking on the link in the previous post, if it works

This post is connected to the post Test post to see if method described in previous post will work for link to jump to a SECIFIC WORD in another page (Click "Back" button to get back to this page)

Clicking the link in the previous post should lead to the section "This is where it should land" if the method works (but as I have said earlier, I have serious doubts).

This is where it should land

Well, as expected, it did not work. Note: You should be on the individual post page (permalink) and not the main page (you get to the individual post page by clicking on the timestamp at the bottom of the post alternatively called permalink, or by clicking on the title of the post in the Previous Posts in the sidebar). If both pages happen to be in the same page, like if you happen to be in the main page, then clicking on the link will take you to the target but is not testing what we are supposed to be testing, which is to take on to a specific spot on a DIFFERENT page.

However below is an update and I am trying another method:
Clicking on the link "TARGET" below in the this post should lead you to a spot: "This is where it should land" in the next post:

Let's see if it works. Well, I couldn't test because the code I put in the post was not accepted by Blogger. So this will have to wait for another time.

NOTE: This post is not complete and is still being updated. I got some new information and testing it out but faced some problem. Still investigating.


Test post to see if the method described in the previous post apply to sections in new pages

Update: The method to link from a particular spot of one page to another particular spot in a DIFFERENT page is given here: How to link from one spot on a page to a particular spot in a different page.

I doubt it will work, but I have to try anyway to make sure the rebuttal I intend to make to someone attacking me on a forum is accurate. (see thread hyperlink to a specific spot in another document (close new window to get back to this page).

I am trying to see if the method How to enable your visitors to jump from one part of your post to another (Click "Back" button to get back to this page) to make a link jump to a specific word in the same page will also work for jumping to word in another page. So I am going to see if a clicking a link on this page can cause the reader to jump to a specific word on another page. The way I am going to test it is to go to the individual page (permalink) of this post, click on the link, and see if it will help me jump to a specific word on that post.

Here is the link: A word in a another post. If it leads you to another post with the word "This is where it should land", then the method described will work for jumping to a specific word in another page, but I really have serious doubts, but I have to try anyway.

Update: Well, I tried. I have made the target in the next post where clicking on the above link should lead to, but nothing happens when I clicked it. This confirmed what I had said in the previos post, that the method wouldn't work for jumping to a specific word in another page.

Trying another method. This link should lead you to a spot in another page (next post) "This is where it should land. I am always in the process of learning and trying things out, so let's hope for my reader's sake, it works. (Note: for some reason or other, the HTML for the link is not accepted because Blogger is giving the error message "Your HTML cannot be accepted: Tag is broken:" even though when I ask those who should know says the HTML is OK. Will try another time when I have the time and the information).


Thursday, October 19, 2006

How to enable your visitor to jump from one part of your post to another

Sometimes bloggers may want to make it easier to navigate to a particular section of their page by clicking on a link rather than scrolling around the page to look for it. For this, you will have to use the target attribute and the name attribute.

For example, you want your visitor when they click the link evolution to be led to a section "Evolution". Then what you should do is to first put a target attribute at the section "Evolution" somewhere on that same page.

Then in the section Evolution, the target attribute you should put there will look like this:

<h2><a name="evolution">Evolution</a></h2>
or you can also write it this way:
<a name="evolution">lt;/a><h2>Evolution</h2>
or even
<a name="evolution">lt;/a>Evolution or any text, it doesn't matter.

Then, in the original spot from where you want your visitor to jump to the "Evolution" section, you put the name attribute which will look like this:

<a href="#C4">See Evolution</a>


Let's say this have a block of information here, and then described something that would help the reader to jump to the section on evolution. (not sure how much text I need to put in to make a good example). So I put a link here See Evolution

The code for the above link is
<a href="#"evolution">See Evolution</a>

Then I may have a block of text here, which I wish is much longer, but for the moment I am just going to do a simple example to try to demonstrate better. OK, this is the part I want the reader to jump to when I click on the link above:


Study of Evolution

The code I put in front of "Study of Evolution" is
<h2><a name="evolution">Evolution</a></h2>

I really wish I have more text to demonstrate better, but there are just too many files in my "to do" folder. However, I think what I did above is enough to illustrate and explain further how to do it. If any reader find any difficulties, do comment in the comments section, and if I have the time, I will do something about it.


Tuesday, October 17, 2006

What to do when you don't see the toolbar and the EDIT HTML and COMPOSE tabs in Blogger post editor

I first came across the experience of not seeing the post editor toolbar and the EDIT HTML and COMPOSE tabs in the post editor of Blogger Beta using Opera browser. For reasons too long to describe here, I have ended up using Opera (even though it is not recommended as Blogger recommend IE and FireFox). (I use FireFox for my more regularly updated Blogger blogs). However, there are other times when I get into the post editor of a Blogger Beta blog, also in Opera, I could see them all. So this seem to be an on and off affair. I find changing browser help. (changing browser is my natural reaction to a lot of problems. See this post on the advantages of having more than one browser in your computer: Why you should be using more than one browser. (Click the "back" button to get back to this page)

I have also encountered this problem in other browsers, however, I have noticed the problem occur most frequently in the Opera browser. A reader of my blog Blogger Tips and Tricks contacted me with the same problem and I have adviced her to change browser and/or clear private data (cache, cookies). She reported back that it helped her solve her problem. Another member of the Blogger Help Forum also complained of the same problem and I have given the same advice and that too has helped her.

Others have said that doing a refresh will help.


Sunday, October 15, 2006

Advice to Blogger blogger regarding the coming mandatory switch to Blogger Beta

Blogger Employee has indicated that it will only be a matter of months when all blogs will have to be migrated to Blogger Beta irrespective of whether they want to or not. From the posts in Blogger Help, it looks like there are quite a number of bugs that need to be ironed out. Even those bugs reported to be solved seem to be still a problem. For example, beta blogger being unable to commenting on blogger classic blogs, and vice versa have been reported to have been solved. I have tested that and have found positive results: Testing non-Beta bloggers commenting on Blogger beta blogs and vice versa. (close new window to get back to this page). However, a reader of my blog complained that he (blogger beta) failed to comment on blogger classic blogs and he is FEDUP. I have read posts complaining of the same thing, and I am forced to do an update to my post.

I am used to working on the classic template, but have found the beta template so different that I am having difficulties (I am not a programmer, but have learn a little bit of Fortran programming and have some familiarity with HTML, CSS and Blogger tags) and I am afraid that what I can do now I may not be able to do later, unless I really take time to learn how the new template works. For those want to see how a beta template looks like, surf to this post: How a Blogger Beta template looks like. (close new window to get back to this page)

My solution is to do the following and it is also my advice to others. Backup the template each time I do any customization. Back up the template even if no customization is done. Many readers of this blogs are relatively new to Blogger and may not know how to backup a template. If you are one of them, see post Backing up Blogger template, changing template, etc.. (click "back" button to get back to this page)

Blogger beta says you will be able to revert to your last saved classic template if you don't want the beta template. Near the bottom of this post is described how to do that: Switching from Blogger Beta to Blogger classic. (Close new window to get back to this page). However, don't depend too much on that. If you are the cautious type, save the templates in your computer. You can also save it online as there are online file hosts, etc., in addition to saving it on your computer. When the forced migration come and I find too much problems, I will most likely revert to the classic template for my blogs. I can live without the labels (categories) features as I already have workarounds for that, and others have plenty of hacks for that yet. See the following posts (click "back" button to get back to this page):
Blogger categories step-by-step (a summary of the following two methods)
Blogger categories: Simple Method
Blogger Categories: Easy Method

Blogger beta have "Newer Post", "Home", "Older Post" at the bottom of their individual post page (permalink) at the bottom of the page. However, I have a work-around to add that to my Blogger classic blog too. See post How to have "Previous" and "Next" links at the bottom of your Blogger blog. (click "back" button to get back to this page). That post uses table, and actually uses "Newer Post" and "Older Post" and also does not have "Home", and someone commented that he doesnt like table. If I have the time, I will redo that post or do a new post and redo all the "Newer Post" "Older Post" without using table, and also include "Home" for this blog if I have the time.

I think I can live without their Layout too. I believe reverting back to classic template will enable me to continue doing the things I am used to if I find that what I want to do can't be done in the beta template.

UPDATE: Read a post where someone who have 2 classic blogs (completely different) with different identities got the 2 blogs merged into one when migrated. So if you have 2 blogs you want to keep them separate (I have some environmental blogs and some blogs about blogging, and I have separate profile for them), do make sure they have different gmail or Google accounts, or make sure that any email addresses associated with them are not similar gmail addresses.


Friday, October 13, 2006

How not to put off visitors if you are in the habit of making links open in new windows

Many Webmasters and bloggers think that in order not to lose visitors, they should make links open in new windows. Others are of the opinion that it is a bad practice as it will discourage visitors from visiting your site again. So I did a sort of a poll (using comments) to find out if people are put off by sites having links open in new windows. See Poll - does making links open in new windows piss you off? (click back button to get back to this page). The majority of those who responded says no. However, it may not be a representative sample as those who responded I assume are all bloggers themself, and may not represent the general population. Also, one said that he prefer links to open in new windows if they lead to other sites, and in the same window if it is on the same site.

After the result of the poll, I have decided to continue my practice of making links open in new windows, but add a comment after the link (close new window to get back to this page), and when I make a link to the same site, add a comment (click back button to get back to this page).

I hope that will help, and also prevent confusion such as visitors having got used to links opening in new windows closing the window when they click a link leading to the same site (which open in the same window).

I hope very much you will leave your comments on what you think of this practice. It will be good for you to know too, as that can influence you on what practice to follow by knowing what other thinks.


Thursday, October 12, 2006

How to put a wide image in the blog without causing the sidebar to slide to the bottom of the page

I am going to test to see if putting an image wider than the main column into a post will cause the sidebar to slide down to the bottom of the page by putting it into a scroll box. The photo I am going to put in the scrollbox below is 800x600 pixels whereas the main column width is only 410 pixels. Here goes:

800x600 photo

Well, I published it, and checked in Internet Explorer, FireFox and Opera, and in all 3 cases, the sidebar stayed where it is supposed to be - at the top of the page. So, if you ever want to put a large image in your blog without the problem of sidebar sliding to the bottom of the page, put it in a scroll box. To get HTML for the scroll box, go to How to make a scrollable box.

If you don't like this because your visitors have to scroll to see the rest of the photo, another way is to choose a template with the sidebar on the left and the main column at the right like Sand Dollar. Look at these 2 blogs which uses the Sand Dollar template. Notice how large the photos are, and they don't cause any problem with the sidebar:
Plus Toll Plaza (close the window to get back to this page)
After 1994 (close the new window to get back to this page)

Update: Rose commented that a better idea is to post a thumbnail so that visitors can click on the thumnail and go to another page to view the photo (see comments section). There are normally more than one way to solve a problem, and mine is one and Rose is another. But I think a better idea than posting a thumbnail is uploading the large photo via the normal Blogger way which will place something bigger than a thumbnail but which will be reduced in size by Blogger to fit the column, and visitors still have the option to click on the image to view the larger image. I normally include a message to click on screenshot (most images I post are screenshots) to enlarge.


Wednesday, October 11, 2006

How to post a photo on the profile for New Blogger

Update 8 February 2007: See post Testing using New Blogger (formerly beta) for hosting photos for the profile, sidebar, etc.

This post is a result of analysing traffic to my site with statcounter (Something you should do. To see how to install statcounter to your blog, read post How do I track visitors to my blog. For those using Blogger Beta, look at Adding advertisenent, hit counter, etc to Blogger Beta blog). I saw people searching for terms like "adding photo to profile" being directed to wrong pages, so I though it will be a good idea to publish a post specially for that. Should be helpful for those who do not know how to do it.

In Blogger, to add a photo to your profile, first you have to host your photo somewhere. The photo must be less than 50k. It can be with an external photo hosting site like Photobucket, or with Blogger itself. However, with Blogger, you can't upload the photo the way you do it with posts. See this post on the way to do it: Getting Blogger to host your Profile photo, etc. (this post was prepared before New Blogger (formerly Blogger Beta) was introduced. Now you will have to refer to Getting New Blogger to host photos for your profile, sidebar, Header, etc.). Then you must get the URL of the photo.

To have the photo in your profile, sign into Dashboard, click EDIT PROFILE in the top right-hand corner of the page, then towards the middle of the page, look for this:
screenshot of adding photo URL to add photo to Blogger Profile
Click SAVE PROFILE and republish whole index.

Note: Some have complained that Blogger wouldn't accept their photo URL because it is too long when they use Blogger to host their profile photo. I have suggested using tinyurl to convert their long URL to a short one, but they have reported back that it doesn't work. The alternative then is to try to use a very short title when you save the photo into your computer and see if that helps. Alternative is to use external photo host like photobucket. Update: This post was written before New Blogger was introduced. Now with New Blogger, you can have photo URL of up to a maximum of 256 characters. See Testing uploading of photo to the profile for the New Blogger.


Tuesday, October 10, 2006

How to put screenshot to your posts

To add screenshots to your post is very easy. All you need is a suitable image editor. The ones I use are Paint and Irfanview. Paint is available by clicking START > PROGRAMS > ACCESSORIES > PAINT on the taskbar at the bottom of the page. Get to the page which for which you want the screenshot to add to your post and click the PRINTSCREEN key. Then go to PAINT program. and click EDIT > PASTE at the menu bar at the top of the page. You will see the former screen in the image editor window. Here you can do various things like rotate or resize (stretch) your image, add text, put a circle or box round the thing you want highlighted, etc. For example of a part of the screenshot highlighted, look at the screenshot in this post: How to put images in sidebar.

The very important feature missing from Paint is allowing cropping of the image when you want only part of the image to display. For that you should get the very good and free Irfanview. To download and install the program, just do a search "download irfanview" and you will get a choice of many download sites. With Irfanview you can crop your image, resize your image more accurately using pixels (Paint uses percent), make your cursor display (for this, you cannot use Printscreen. Go to the page for which you want the screenshot, go to Irfanview, press the key C, then in the pop-up, click START. This will bring you back to the previous screen, place the mouse in the position where you want the cursor to be displayed, press ctrl+F11 and the image editor window in Irfanview will be filled with the screen with the cursor showing. For example, look at this one of the screenshot in this post: Uploading and manipulating photos with Blogger (and Blogger Beta). This post will also help you to manage your screenshot for uploading.

When you have the image ready, save into your computer and then follow the instruction in the post Uploading and manipulating images in Blogger (and Blogger Beta).


Monday, October 09, 2006

Testing if scroll box works for images

Putting images in a scroll box

This post is in response to a reader who asked if the instruction for a scroll box in HTML for a scroll box works for images. I am also interested to find out, I am going to test it out now:

image 1 in scroll box

image 2 in scroll box

image 3 in scroll box

Well, as you can see, the test is successful, the images put into a scroll box is scrollable. There are 3 photos in the scroll box. You can scroll down to see them.

If you want to know how to do a scroll box, refer to this post: How to make a scrollable box. (Use the "back" button to get back to this page)

BTW, the images you see in the scroll box are photos of dancers in a very colorful event called Citrawarna (The Colors of Malaysia)held in Kuala Lumpur, Malaysia every year. It will showcase a kaleidoscope of arts, culture and tradition of the multi-racial nation. It will be a grand parade with thousands of dancers from all over Malaysia performing. Since 2007 will be Visit Malaysia Year, I would expect next year's Citrawarna will be held in a very big way. Citrawarna Malaysia is expected to be held in July 7, 2007. Many events will be organised for the tourist and 2007 will be a good year to plan for a visit to Malaysia.

Related post:
Scroll box FAQ


Sunday, October 08, 2006

How to make a scrollable box

A reader of my blog Testing Blogger Beta asked how to make scrollable box or scroll down box (or scroll box, I don't know what exactly to call it). To see what I mean by scrollable box, surf over to this post: Testing adding of Google AdSense search box in Blogger Beta. There are some scroll boxes there in which I had to put some HTML codes, which if done any other way, will cause the sidebar to slide the bottom of the page because it is too wide for the main column width.

One of the way do this is to paste this code in your post editor (there is another way further down the post):

<div style="overflow:auto; height:300px; width:400px">
<table cellpadding="0" cellspacing="0" style="width:250px;">
<td>Put your stuff here</td>

Type or paste whatever text or HTML you want in the place where you see "Put your stuff here" (and of course then delete "Put your stuff here" and publish your post).

Note: The width and the height of the box can be changed by changing the numbers in height:300px; width:400px". Note also that there is a large space above the first line of the text. I don't know what is causing this, and am trying to find a solution to it. When I do, I will put an update or redo the post. The trouble is, I am trying to do so many things at the same time. If this is troubling you, do remind me.

UPDATE: 21 November 2007: A blogger provide the solution by putting all the codes in a single line. Read the comments. There is also a second solution. Read another update lower down the post

The reader also ask if that will work for pictures. That is an interesting question. I will have to test it. (This has been done. See post Testing if scroll box works for images. (Click the "back" button to get back to this page).

UPDATE: A reader of this post has commented and given a link to a scroll box generator. For that generator, you will have to enter variables like width of box (important), height, font size, color, etc. I have tried it and it works. But haven't had the time to test it more thoroughly. The generator is at this site: Scrollbox Generator. (Close the new window to get back to this page). The tip is given by Luigi who have made a scroll box here: Trovamiunnome (close new window to get back to this page).

If you surf to that scroll box generator, you will see the variables you will have to select in the screenshot below:

scroll box generator

<div style="width: 395px; height: 400px; background-color: a0ffff; color: 000000; font-family: arial; font-size: 12px; text-align: left; border: 0px solid 00000; overflow: auto; padding: 4px;"></div>

copy from the file, paste it into the post editor, adjust the width: 395px; height: 100px; to suit the occasion and paste the codes I want to display just before the last </div> tag.

To make it clearer, I will put in some text in red where you are supposed to type or paste what you want to appear in the scroll box:

<div style="width: 395px; height: 400px; background-color: a0ffff; color: 000000; font-family: arial; font-size: 12px; text-align: left; border: 0px solid 00000; overflow: auto; padding: 4px;">Paste what you want to appear in the scroll box here</div>

UPDATE: 21 November 2007: What I have been doing for a long time is to generate the script once, save it into a Notepad file. Now whenever I need a scroll box, I just open the Notepad file, copy-paste the script into the post editor window, edit the width and height according to what I want (the width will normally depend on the width of the main column, ie., posts while the height will depend on the length of the stuff I put inside the scroll box and/or how high I want the scroll box to be. If you don't know the width of the template you use for your blog, refer to How to find the widths of the blog Header, main column (posts), sidebar of your blog (click BACK button to get back to this page)

Update 27 July 2007: A reader has asked if the scroll box border color can be changed. That is very easily done if you use the scroll box generator mentioned above. If you look at the screenshot, at the last line, you have the choice to chose the border color. You can either "select from chart" or enter a hexadecimal color code for a greater variety of colors. If you chose the last option, the free ColorPic tool will be very handy. Type or copy-paste "colorpic" into the search box above, tick "Web" and search. I believe the site from where you can download the tool will be the first result of the SERP (search engine result page)


Scroll box FAQ


Thursday, October 05, 2006

How to merge multiple blogs in multiple accounts into one Blogger account

To merge multiple blogs in multiple account into one Blogger account, do the following. Since this post is motivated by someone who have multiple (I assume 3 or more) I will be writing this with the assumption that you do have 3 or more multiple accounts, but if you have only 2 accounts, I think it is no problem after reading the post how to adjust for that.

Update: Some bloggers who have successfully merged blogs in multiple accounts into one has also deleted their excess Google Account. Please note that images uploaded via the deleted Google account will no longer be displayed. Advice is to never delete any Google account even if you no longer have any use for it.

Before doing that, a piece of advice. If you are using only Internet Explorer, get FireFox, a much better browser than IE. Refer to What is FireFox and why you should be using it. It is a big advantage to have more than one browser on your computer. Read about the advantages of this in Why you should be using more than one browsers. All this will also make your following task easier. You may also want to add Opera. (You can do it with only one browser, but you will have to keep logging in and logging out).

In one browser, say, Internet Explorer, sign into your Blogger account which you want the blog transferred. Select the relevant blog. Click SETTINGS > MEMBERS. Click "Add Team Member(s). Then under New User(s), add the email of your other account in which you want to make your main Blogger account.

Open another browser, say FireFox, sign into your other Blogger account. Click on the blog. Click SETTINGS > MEMBERS. Click "Add Team Member(s)". Do the same thing as above.

Open one more browser, say Opera. Sign into the email with which you have registered with the main Blogger account. Check for the email invitations. Accept the invitations.

Go back to your previous browsers and get back into the Blogger account. Get into your MEMBERS setting. Make sure that your main account have been added as a team member. Give the the main account (yourself) administrative rights. Do the same for the other Blogger account in which you have added your main account as a team member. (In this case where I have assumed you have 3 accounts, it means going to the other browser).

Now that you have given the main Blogger account administrative rights, Go back to the browser in which you have signed into the email for the main account. Sign into your intended main Blogger account. Check your blogs, and make sure that the blogs have been added. Select the blogs, click SETTINGS > MEMBERS and make VERY SURE that you do have administrative rights. Then if you wish, you can remove the other team members (Blogger accounts). Now you have all your 3 blogs in one Blogger account.

Adjust the method according to the number of Blogger accounts and blogs that you have.


Wednesday, October 04, 2006

How to have different profiles for different blogs

Update 30 March 2007: This post have been superseded by a new post: Different profile for different blogs in the same Blogger account Part II

UPDATE: Before you try to use this method, read the comments section first.

UPDATE 13 November 2006: There is one more comment that says the original owner of the account cannot be removed, even if the new team member is given administrator works. Since I have limited time and may take some time to test it myself, please read the rest of the post with a pinch of salt. It may not work.

Bloggers frequently have more than one blogs. If the blogs are all in the same Blogger account, all of them will have the same profile. If you want to have different profiles for different blogs, this is what you must do. It would help if you have more than one browser otherwise, you will have to log in, log out, log in, etc. This will be especially true for those using Blogger Beta.

If like many, you have only Internet Explorer, I advise you to install FireFox. It is a much better browser than Internet Explorer. (you may chose to use only one browser if you want, but having 2 browsers will be more convenient). Refer to What is FireFox and why you should be using it. See also the advantages of having more than one browsers on your computer: Why you should be using more than one browser

OK, back to the topic. To get your blogs into different account:
1. Start a new Blogger Account with a different email address from your original account.
2. Open a different browser (if you want to use the same browser, you will have to sign out)
3. In the new browser, sign into your original Blogger account (Dashboard).
4. Select the blog you want to be in the new account.
5. Click the SETTINGS > MEMBERS tabs
6. Click "Add Team Member/s"
7. Enter the email address that you used for the new Blogger Account in the New User(s).
8. Go back to the previous browser. Sign into the email address referred to in no. 7
9. Look for the invitation. Accept the invitation.
10. Go back to the browser where you have the original Blogger account and the blog in which you want to be in the new account. In the MEMBERS setting, you should see a new member. Make him an administrator (be very sure of doing this).
11. Go back to the first browser and get into your new Blogger account and confirm that the blog is in your Dashboard.
12. Now that you are sure things have worked out, in your original Blogger account and the relevant blog, in the MEMBERS setting, remove yourself as a member.

Now you should have 2 blogs in two different Blogger account and you can set different profiles for the 2 blogs. And if you are using 2 different browsers, you can be logged into both at the same time.

Update: I have written this post solely from logic and from I know of how Blogger works. But I never had to try to change the profiles for my different blogs myself. A reader commented that he followed the instructions, but found that while he now have 2 users on both blogs as administrators, he could not remove the original user from the secondary blog because the remove option isn't available (see the comments section). If I have the time, I would test that out and report it here. In the meantime, if you have tried to make different profiles for your different blogs and found the same difficulties, I hope you will put your comment there.


How to ban a person from your blog or Website

You may have some issues with a person. For example, he may be posting unwanted comments on your blog, or you may just don't want him/her to see your blog.

Well, if you know the IP address of that person, you can ban him from your blog or Website. (There is a post for getting the IP address of a commentator on your blog. Refer to How to get the IP address of a someone who comment on your blog.)

Go to Toolator: IP address blocker and you can fill in up to 3 IP addresses of persons you want to ban and redirect either to a default site given by Toolshell or put in the URL of the site you want the banned person to be redirected tool. Then all you have to do is to click a button to generate a code to add to the template of your blog. This will place a button IP address blocker on your blog. Which part of your blog it will appear will depend on where you paste the code. For a guide to this, refer to Blogger template tutorial - adding content via the template. You have a up to 8 choices of what type of button you want.

Note: this will work well if the person you want to ban have a fixed IP address. However, if he has a dynamic IP address, this may not work so well. Also, I tested it using Blogger Beta. Testing IP banning in Blogger Beta. Actually, it is just a redirect. After adding the script, when I tried to get into my blog, I saw it momentarily, and then was redirected to another site (which shows that it works).

Update 8 October 2007: Charles of Artificial Intelligence - One Man's Quest asked if banning more than 10 IP addresses by adding more scripts will work (see comments). I responded saying it will be hard for me to test and suggested he try that. His response was that he could ban more than 10 IP address by his own 11th pipe delimited, and tested it, and it seem to work. He also suggested adding a SECOND head section just before the </html> tag (this should be the last line of the template)
<meta http-equiv="Pragma" content="no-cache">

to prevent the use of the cache to read whatever got loaded before the redirection take place. I have not tested this yet.

Acknowledge: I came to know about Toolshell IP check and IP ban of Rose Desrochers

Rose said in the comments section that you can't ban AOL users using this method. I would have loved to test that and to update this post, but I don't get many people I want to ban from my blogs, and also not that many visitors from AOL. If anyone have experience with that, I hope you will put your experience in the comments section.

UPDATE 24 December 2006: Toolshell IP Check and IP Ban site is online again. You can now ban up to 5 IP addresses and can choose the site you want the banned person to be redirected to. So the method described below will work again.

UPDATE 23 October 2006: Toolshell IP Check and IP Ban site is no longer accessible. Why, I don't know. However, if you are desperate, you can read through the post, click on the link and see if the site is online again.

Update 5 October 2007: Toolshell IP Ban is online again, but this time you will have to go to Toolator IP Ban, plus now you can ban up to 10 IP addresses. Someone asked if he can ban more, and I suggested perhaps try adding more than 1 scripts, and the feedback I got seem positive.

LATEST: Toolshell or Toolator or whatever keeps changing and I have given up trying to keep up to date. If you need more information, go to their contact form.


Monday, October 02, 2006

Testing publishing a post from Writely to Blogger

I am testing Writely, an Web based document editor, to post to my blog. Web based means that to use the word processor, you don't need to download any program into your computer, you just need to get online and sign into your Writely account. You can use writely to prepare and publish into your blog without having to sign into you r blog account. I want to see how it works and if there are any advantages of using W directly the post editor in Blogger itself.

Inserting Images

With Writely, you can insert table, image, link, bookmark, comment, page break, horizontal line and special character. I am going to try to insert an image below. That image will be a screenshot of the pop-up that enables you to insert the image:

To insert an image, you first click Browse, then select the image file stored on your compute. You can also choose to insert a title to the image. In my test, I did that. I typed "Pop-up got inserting image" into the title field, but as you can see, the title is nowhere to be seen. You can set the the width and height to image size or pixel. However, it is not importent as after you have inserted the image, you can drag and drop to resize the image. You can set the alignment to top, bottom, left, right, center and middle. I have set the alignment to center, but it doesn't seem to make a difference. When you have finished setting your preferences, you click OK, and after some time, the image appear in the editor window. You can drag it to wherever you want. This ability to insert image is an important feature especially as it gives you one more option to insert image when inserting image direct in your blog program fails (Recently there was a lot of complaints of being unable to upload images in Blogger).

UPDATE: Editing and republishing the post from Writely have changed the font of the post. It not only changed the font of the post published from Writely, but the font of all the posts in the main page is also changed. However, when I check the post listed in the PREVIOUS POST, the font wasn't changed. Also, for the post in the main page, when I click on the permalink to go to the individual page, the font also remained original. Trying to find out what is going on. I am updating this post from Blogger. I am going to see if there are any changes when I publish the post. Also, Writely introduced a lot of HTML tags into the post, and the letters are in bold which is against what is recommended by W3C (The World Wide Web Consortium). I put the screenshot of the Blogger post editor below: (click on screenshot to enlarge)
Blogger post editor with the post published from Writely
Note that there is no title. This is bad for the blog, and especially bad from the point of view of search engine ranking. It would be advisable after publishing from Writely to log into Blogger and add a title. I also noted that the first screenshot (uploaded from Writely) is hosted by Writely. This is an advantage if you are worried about your limit for your Blogger account.

FURTHER UPDATE: After editing and publishing through Blogger, all the fonts have gone back to normal. Don't know what is going on. Also, there is a disadvantage with using Writely to post, and then editing your post with Blogger. If you want to add something from Writely, for expample, another photo, you may face problem because the document in Writely and the document in Blogger will be different, and if you don't change the document in Writely to reflect what you have edited in Blogger, and then add the photo and republish, you will lose what you have edited in Blogger.

UPDATE 3rd October, 2006. According to Writely's Help files, at the moment, you can't publish to Blogger Beta via Writely.


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