Friday, November 24, 2006

How to delete comments Part II

Recently I found that my sidebar of some of my posts were down at the bottom of the page, and it wasn't my fault. It was caused by commentors who left long unbroken text/unclickable links in the comment. I tried to delete the normal way, that is, log into Blogger, surf over to the post containing the comment, look for the trashcan icon, click on it, and confirm deletion. Well, it didn't work for me, probably because I had tampered with the permalink (timestamp). So I had to contact Blogger support. That is another story that you can read here How to contact Blogger support. I finally did get a reply from them with instruction on how to delete the comment.

I found the month in which the problem post was, click on that month in the archives, scroll to the post, click on the comments, and there I finally saw the trashcan, click on it, and deleted the offending comment.

So folks, sidebar sliding to the bottom of the page may not be only your fault. You should check the comments made by your visitors to make sure they don't contain any long unbroken text/unclickable links.


Saturday, November 18, 2006

Blogger Beta: Adding a working searchbar and AdSense link unit to the Header

A reader of my blogs asked how to add a working search-bar to the Header. Actually, this post Adding a graphic to your Blogger Beta blog Header (close new window to get back to this page) will show how to do it if one understand the method, but I thought it will be a good idea to experiment on another blog and describe the method specifically how to add a working search bar and link unit to the Header. You will see in this blog Motivation and Self Improvement (close new window to return to return to this page) a working search-bar and a link unit in the Header. Type some keywords into the search box and try it out to confirm it works. Note that there are other things in the sidebar and in the footer, but when I started, there were only the standard profile and archive in the sidebar. The rest were added later. Update 2 November 2006: I changed to Ramani's 3 column Minima template and tried to add the searchbar, but this time, when previewing, I got the error message"Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly.
XML error message: Attribute name "checked" associated with an element type "input" must be followed by the ' = ' character." However, do read the rest of the post as it is now possible to add a working link unit to the header without having to tamper with the AdSense script.

This is the way I added a working search bar in the header. Sign into Dashboard. For the blog you want to modify, click LAYOUT, then click EDIT HTML. Then look for this block of codes in the template:

<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Replacing Blog Header (Header)' type='Header'/>

Change maxwidgets='1' to maxwidgets='' and change showaddelement='no' to showaddelement='yes'. So the section should now be

<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='' showaddelement='yes'>
<b:widget id='Header1' locked='true' title='Replacing Blog Header (Header)' type='Header'/>

Click SAVE TEMPLATE. Then click PAGE ELEMENT tab to go back to LAYOUT. You will see an extra "Add a Page Element" above the Header. Click "Add a Page Element" and int the pop-up, select HTML/JAVASCRIPT and type in <!-- searchbar --> into the box, click "Save changes". In my case, I have not added any HTML/jayascript in that template, so this widget shold have id='HTML1' (circled in red in the screenshot below: (click to enlarge):
Blogger beta: HTML1 widget
If you have already other HTML widgets added, just count the number of the HTML widgets you already have (say X), then the "blank" page element you just added above would have the id='HTMLX+1' and you will then have to paste the searchbar script in that widget.

I opened another tab to sign into my AdSense account to generate the searchbar script, copy, return to the post editor, and pasted the script just after
<div class='widget-content'>

If you want the searchbar to be centered, then surround the searchbar script with tags <center> and </center>

To add the AdSense link unit, I go to the Layout, and in the Header, click "Add a Page Element" and in the pop-up, select HTML/javascript and type in a comment
<!-- link unit -->
then click "Add to blog". As this is the second HTML widget I added, I then opened the HTML editor with the "Expand HTML widget" ticked, and look for what is shown above, but this time with HTML2 in the widget, go to AdSense, generate the script for the link unit and pasted it just after
<div class='widget-content'>
However, this time, for the link unit to be displayed, the comment tags <!-- and //--> have to be deleted from the script. This is technically violating the AdSense Program Policy, and I will be contacting them regarding this. I will post their response here.

UPDATE 2 December 2006: It is now possible to add a working link unit in the header via the "Add a Page Element" widget in the Layout, so the above hack is no longer necessary

UPDATE 22 November 2006: A comment from a reader: "the showaddelement= No to be changed for getting the google search in head wrapper is not present in the beta template anymore google must have removed it.. any ideas"

I tried answering him in the comment section, but it will not accept the code I tried ot paste in there, so no answering his question here.

I started a new test blog and opened the template editor. I found the followin codes in the template:

<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Show Element (Header)' type='Header'/>

That confirm Blogger Beta has not removed the "showaddelement='no' from the Minima template. Maybe he was using a different template or didn't look hard enough. If you have any problem searching for a line of code in the template, one easy way is to copy the template into Notepad, use the search function to find the code, do whatever modification you need to do, copy the modified template, delete the content of the template editor window, paste the modified template into the now empty template editor window.

Books from Amazon

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

Adsense Unleashed: Adsense A-z Plus 175 Killer Tips And Tricks


New Blogger: How to make the permalink more prominent

In the new Blogger beta blog, the link to the individual post page (permalink) is still represented by a simple timestamp Google Blogger timestamp permalinkat the bottom of the page. Clicking on the timestamp will take you to the individual post page. If you want the URL of the individual post page (permalink), you right-click on the time stamp and select "Copy link location" (This is for FireFox. Wording will be similar but different for different browsers). I am suprised that Blogger still use the same method of displaying the permalink, as most people unfamiliar with the Blogger setup will not realise the timestamp is a permalink. To make this more prominent, you can add a text PERMALINK next to the timestamp. To do this, you can add a text PERMALINK or any othe text you wish next to the timestamp (or even replacing the timestamp if you wish. To do this, you will have to click on the TEMPLATE tab to access the template, tick the "expand widget template" and then look for this block of codes:
<span class='post-timestamp'>
<b:if cond='data:top.showTimestamp'>
<b:if cond='data:post.url'>
<a class='timestamp-link' expr:href='data:post.url' title='permanent link'><data:post.timestamp/></a>

then insert the text PERMALINK (shown in red) or any other text you like, in the code

<span class='post-timestamp'>
<b:if cond='data:top.showTimestamp'>
<b:if cond='data:post.url'>
<a class='timestamp-link' expr:href='data:post.url' title='permanent link'><data:post.timestamp/>|PERMALINK</a>

NOTE: For those still using old classic Blogger template, refer to Make permalink more prominent (old classic Blogger template)


Wednesday, November 15, 2006

Putting a working Google AdSense Searchbar in Blogger Beta

Udate: This problem has been solved. You can paste your script for the Google searchbox direct in a HTML/Javascript widget of the Add a Page Element in the LAYOUT and it should work.

If you try to put a Google search bar in a Blogger Beta blog in the Layout by adding the script via the "Add a Page Element", it will not work. I have tested it. However, you can get a working Google search box by pasting the script into the template. To see how this can be done, look at Testing adding of Google AdSense Searchbar in Blogger Beta. Recently I did a test again to see if the script can now be added via the "Add a Page Element" in the Layout of a beta blog and find that it still would not work. AdSense Help Center had been informed about it, and they have forwarded the message to Blogger, so let's hope that this bug will be solved soon.


Saturday, November 11, 2006

Precaution to take before linking to a Website

Occasionally, you may get a request for a link exchange, or you may just want to link to a site as part of your post, or you just like the site. Before you link to any site, it is good to check the PageRank of the site. In the first place, it will be advantageous to you if you exchange with a site that has a higher PageRank than yours. However, any link relevant to your site content, whatever the PageRank (as long as that site is not blacklisted) helps in the ranking. More important is to find out if the site has been blacklisted by Google. A site may be blacklisted for doing black-hat SEO (Search Engine Optimization) such as making certain keywords invisible by making the color of the font the same as the background, etc. It does not matter if a blacklisted site link to yours as Google knows you have no control over who link to you. However, you do have control over who you link to, and if you are unfortunate enough to link to a blacklisted site, your site will also be blacklisted.

The question now is, how can you find the PageRank of a site, or more important, how would you determine if a site have been blacklisted. You can do this easily by installing FireFox with Google toolbar (close new window to get back to this page). After installing FireFox with Google toolbar, you should surf over to the site using that browser and look for the the PageRank icon, FireFox with Google toolbar PageRank icon let your mouse hover over the box in the icon and the PageRank of that site will be displayed with value from 0 to 10. If the box is grayed out, and no value (not even zero) is shown, that means that site had been blacklisted by Google and you should not link to that site. Otherwise, your site will be blacklisted as well.

Update 14 November 2006: Someone left a comment which contain a long unbroken and unclickable link which will cause my blog's sidebar to slide to the bottom of the page. This is the third time I may be forced to delete the comment (I have tried viewing this post in IE before deleting it, but suprisingly the sidebar is not affected so I have not deleted the comment yet. Took me some time because I was getting the error 500 message, but now it is viewable. Anyone viewing the post/blog with IE, I hope you will comment and let us know what you see w.r.t the sidebar). However, I reproduce part of the comment here: ""A completely gray PageRank toolbar meant that Google did not have that page listed in their index – either because the page was too new to have been indexed, or the page had been banned by Google.' therefore how can you say a grey out box means the site has been blacklisted." There seem to be some controversy over the interpretation of the Google toolbar PageRank icon, and hoping to clear this matter up, I have contacted Google for an authorative interpretation. I hope I get a response, and if I do, I will post it here. I am a scientist, and scientists like to experiment. So I have created a completely new blog with just one article and which should definately not have been indexed yet, and checked the PageRank with the Google toolbar icon. The PageRank toolbar was not grayed out but white, and the value shows zero. See the screenshot below (click on the screenshot to enlarge):
Google toolbar PageRank icon
Google toolbar PageRank icon


What to do when you cannot publish a post.

The simplest thing to do is to switch browser. I have 3 browsers on my computer, and I find switching browsers solve many of my problems like not being able to post, upload photos, cannot log in, cannot open a Web page, etc. Recently, for example, my son wanted to log into his online banking, but the page just wouldn't display the section for the login. He was using Internet Explorer. I told him to switch to FireFox, and lo and behold, he got the section for the login and logged in successfully in very short time. There are more examples but it will make this post to long. There is also a feedback from a reader in one of the links below.

According to statistics, the majority of surfers are using only Internet Explorer. For them, I strongly recommend adding FireFox browsers to their computer, especially FireFox with Google toolbar. You can read more about FireFox here and also to download and install FireFox with Google toolbar: What is FireFox and why you should be using it. You will find links to sites that describe more about the advantages of FireFox below.

Blogger recommend two browsers for bloggers - Internet Explorer and FireFox. Opera is not included. For various reasons, I use Opera for my beta blogs, and apart from an occasional hitch, it has been OK so far. If you want to download Opera, you can do it at Download Opera Web browser (close new window to get back to this page).

Blogger has many servers. The problem of being unable to post may be due to a problem with one of the many servers. You may try logging out, clearing your cache and cookies, then logging in again and see if this helps. You may get connected to a working server when you do that.

Advantages of FireFox

Here are some posts about the advantages of using FireFox:
How to get the PageRank of your blog or any other sites (close new window to get back to this page)
A better way to do spell check for your Blogger blog (click "BACK" button to get back to this page)
Testing spell check for Blogger beta (close new window to get back to this page)
What to do when you can't upload pictures, publish post, etc. (close new window to get back to this page).


Friday, November 10, 2006

How to add a caption to photos uploaded via Blogger classic post editor

Today, I took a closer look at the img tag created by uploading a photo via the upload photo icon in the Blogger classic post template and decided to do a little testing. What I discovered, as expected, I can create a clickable caption for the photo. All you have to do is to add the caption just before the </a> tag in the HTML created. If you want it centered, then just surround the text (caption) with the <center> and </center> tags. To see it done, surf over to this post Testing img tag created via the Blogger classic photo upload button in the post editor (close new window to get back to this page).

Update: <center> and </center> but had been deprecated and not encouraged. Better to use <span style="text-align:center;> and </span>

Alternatively, try <div style="text-align:center;> and </div>

Further note: In some browsers, preview will not show the tip is working. Publish and check. If <span> don't work, then try <div style="text-align:center;> and </div>

Feedback highly welcomed for this. Please leave your comments

Update 2 July 2007: Regarding caption that appear in the center at the bottom of the photo, you can only do it effectively if you chose "Center" for your upload. Also <center> has been deprecated, and I don't know how long it will be supported by browsers. An alternative is to surround whatever you want centered with <div style="text-align:center;"> and </div">.

For example, to put a caption under this photo uploaded via the photo upload icon (in the EDIT HTML mode), the script is placed in the scroll box for you to examine for greater understanding:

problem signing into Blogger with Opera browser
Problem signing into Blogger with Opera Browser

Now I will put the HTML script used to display the above image with the caption in the scroll box below:

<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href=""><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;" src="" border="0" alt="problem signing into Blogger with Opera browser"id="BLOGGER_PHOTO_ID_5103431172048186642" /><div style="text-align:center;">Problem signing into Blogger with Opera Browser</div></a>

Wednesday, November 08, 2006

Adding a link list to the sidebar in your blog

This post is written to help a new blogger add a link list to the sidebar in his blog. The link list will be sligtly different from the default link list provided by default in most standard Blogger templates. It will not be an unodered list, which will have gaps in between links, and take up valuable real estate. If you prefer to have space between the links, just add an extra <br /> to the end of HTML for the link. The more <br /> you add, the wider will be the space between the links. Also, if you like my blogs and find it helpful, and want to easily come back to this (and other blogs) plus help other Blogger bloggers find useful information, perhaps you can add this to the template of your sidebar:

<h2>Blogger Resources</h2>
<a href="" target="_blank">Blogger Tips and Tips</a><br />
<a href="" target="_blank">Dummies Guide to Google Blogger</a><br />
<a href="" target="_blank">Testing Blogger Beta</a><br />

Highlight the whole code (click on the inside of the box, press CTRL+A, right click and select copy, then click in a suitable position of your template. To find a guide to where to paste it, this post can help you: Adding content via the Blogger template (click "BACK" button to get back to this page). You can add or subtract from the list of links as you wish.

The above is for those using the Blogger classic template. The way to add a link list is different in the Blogger Beta template. For that, you can add a link list by clicking on "Add a Page Element" in the Layout. More about that later.

If you prefer to separate the links more, you can use an unordered list instead. Then the code you should add will be:
<h2>Blogger Resources</h2>
<li><a href="" target="_blank">Blogger Tips and Tips</a></li>
<li><a href="" target="_blank">Dummies Guide to Google Blogger</a></li>
<li><a href="" target="_blank">Testing Blogger Beta</a></li>

The codes given in the first box will cause this to display in the sidebar in the chosen position:

Blogger Resources

Blogger Tips and Tips
Dummies Guide to Google Blogger
Testing Blogger Beta

and in the second case:

Blogger Resources

You can also use Link List Page Element, but the advantage of using the HTML/Javascript PageElement is that you can backup Link List made using HTML/Javascript Page Element. Link List made using the Link List Page Element cannot be backed up, and if you ever have to change the template, it is highly likely it will be deleted and you will have to start all over again. For fuller details, see Backup template PLUS Page Elements and changing new or backup template


Advice to Blogger bloggers regarding comments, comment moderation, and sidebar problems

There are a couple of things I would like to highlight regarding comments in Blogger blogs. Among other things, it may cause the sidebar of your post to slide to the bottom of the page in Internet Explorer through no fault of yours:

Long unbroken lines in comments and the sidebar

Today, I received a comment moderation notification email and approved it, but only after I posted it, I realised that the commentor has included a long link (non-clickable) which will cause the sidebar to slide to the bottom of the post. I checked in Internet Explorer (most of the time, I use FireFox with the Google toolbar (close new window to return to this page) and confirmed it. I quickly commented on the comment author's blog (there was no email) and explained the reason why I am forced to delete the comment (it was a comment which disagree with my post) and that I hope she will comment again, making the link a clickable link (close new window to get back to this page) and I will approve it. If keeping the sidebar in the proper position is important to you, I will advice that you examine the comments carefully for such things linke long, unbroken line of texts, especially long unclickble links, long line of unbroken code, etc. This has happened to me more than once (see section below).

Moderating comments

For most of my blogs, I have enabled comment moderation to keep out spam comments, etc. However, one day, a member of the Google Blogger Help group asked if he can edit the comments. Now in the comment moderation notification email, there are 3 options - Publish, Reject, Moderate. I have practically all the time clicked Published, and on rare occasions, clicked Reject, but I have never clicked on Moderate. I thouht that clicking on Moderate will allow one to edit the comment, but no. I wanted to check before I answered that question, and looked for a comment to moderate. It so happen that the only comment moderation email notification I had was for a Blogger beta blog. I clicked on Moderate, expecting to be taken to a page containing that comment. Instead of that, I was taken to a page with a list of comments waiting for me to moderate, with the comment I received for moderation right at the top. The comments below I have never received any notification. I took some time to moderate all the comments there. I initially thought that this was only a Blogger Beta bug.

Just in case it is not only a Blogger beta bug, I decided to check on one of my Blogger classic blog (this one) in the Dashboard for this blog by clicking on the "Moderate comments" tab. To my horror, I found a list of 51 comments waiting to be moderated, some dating back to June, and for which I also never received any email notification. And more important, I found that there is no way I can find in which post that comment was made, which makes responding to the comment very, very difficult. So if your comment was not published in good time and/or not responded to, blame Blogger, not me. I have notified Blogger support, and hope they have taken note of the problem and is doing something about it, especially making the information as to which post the comment was made in available when one moderate comments via the Dashboard. In the meantime, if you are moderating comments via email notification, do take the trouble to check "Moderate comments" in the Dashboard once in a while. That reminds me. I must check that in my blog Dummies Guide to Google Blogger (close new window to get back to this page).

BTW, there was one comment with a long lines of unbroken codes in one of my post which canused the sidebar to slide to the bottom of the page, and which I didn't discover for a long time. That was very embarassing because I have a post in my blog which explain what to do when sidebar is pushed to the bottom of the page.

UPDATE 14 November 2006: I logged into Dashboard and clicked this blog in the list of blogs in the Dashboard. Clicked on "Moderate comments" and again found 10+ comments waiting for moderation for which I never receive a email notification. I approved all except 2, one being a duplicate, and another one a spam. I have no idea which posts the comments were made, so am unable to respond. I have already informed Blogger, but looks like they are either too busy, do not want to, or cannot do something about it. I will inform them again and see if matters improve.


Sunday, November 05, 2006

Comparison between hosting images with Blogger and photobucket

Update 22 May 2007: Photobucket has been acquired by MySpace which is part of Fox Interactive Media (FIM) for $300 million!!! That means that Photobucket is now backed by another giant. That changed the situations and what has been said below may no longer apply.

Recently, there has been a lot of reports of problems uploading photos via Blogger, and someone has recommended using PhotoBucket instead. I myself have had only a short spell of problem uploading photos via Blogger, but the problem got resolved either by itself or by using a different browser. See post What to do when you can't upload photos, can't publish, etc. (close new window to get back to this post). But in any case, for me, the problem was transient. Anyway, I thought it will be a good idea to post a comparison between hosting images with Blogger and hosting with third party photo host like PhotoBucket.

Hosting images with Blogger

When one upload a photo to a post via Blogger, the photo is automatically scaled to fit into the width of the main column width, so you don't have to worry about resizing the photo to do that. To do so, you click on the upload photo icon Google Blogger upload photo icon in the post editor toolbar in the post editor toolbar and a pop-up window will appear. You first have to browse through your computer to find the photo, then make a selection - none, left, right, center, small, medium, large. The result of the choices are explained in this post: Uploading and manipulating photos in Blogger blogs (click "Back" button to get back to this page). In the case of the screenshot of the "upload photo icon" you see in this paragraph above, "none" was chosen, which enable me to put the picture right in the middle of text. With that choice, you can place the photo anywhere you wish.

Hosting images with Blogger is my first choice (others may differ). My reason: Blogger, is owned by the giant Google, and is likely to stay in business for a very long time, and the photos I expect to stay as long as my blog and Blogger. Also, Blogger has a very generous limit for the amount of images we can host for our blogs. This is taken from their Help files: "Number of Pictures: If you are posting pictures through Blogger, Picasa, or Hello to a free BlogSpot blog, there is a total limit of 300 MB. If you are posting them to an FTP-published blog, then you are limited to the amount of space available on your server. SIZE OF PICTURES: If you are posting pictures through Blogger Mobile there is a limit of 250K per picture.".

BTW, if you upload pictures via Blogger, the alt="" is automatically included in the HTML for the image. It would be wise for you to add in some descriptive text in between the quotation marks as search engines can't read photos, but can read the text you put in there, plus if for any reason your image can't be displayed, the description will be shown instead. If you do that, make sure your "Insert" key is set to insert and not overwrite, otherwise you will overwrite the HTML. You can test it with notepad if you are not sure. (Note: you will see the HTML code only if you are in the EDIT HTML mode and not in the COMPOSE mode)

Even if I wish to put a photo in the profile or in the sidebar (this I can't do via the "upload photo icon"), I will still prefer to get Blogger to host my photo. This post will explain how: How to get Blogger to host your photo for the profile, sidebar, etc. (close new window to get back to this page).

However, photos hosted with Blogger tend to have long URL like this one I tried to use for my profile: Descartes said..., Enviroman says... (close new window to get back to this page). That has a character length of 83 whereas the maximum for Blogger classic profile photo URL is 68 (Update: for the New Blogger, this has been increased to 256 characters). Thus for the profile for this blog, the photo is hosted with Photobucket, which uses a shorter URL. This disadvantage may no longer be a hinderance if you are using New Blogger (formerly Blogger beta) because the maximum character length has been increased to 256. BTW, if you are interested in using that cartoon I used for my profile photo to help environmental awareness, you are free to do so. A link back will be highly appreciated, but not compulsory.

Hosting images with Photobucket

There are other photo hosts, but I will concentrate on PhotoBucket since I can write from personal experience. The profile photo in this blog Enviroman Says (close new window to get back to this page) is hosted with Photobucket because it was my first blog, and that was the way I knew how to do it then. If I ever want to host a photo again for a profile, I will use Blogger. I am using a free account as I do not need the extras for a paid account which is USD25 per year (about $2 per month), and which may be cheap for US bloggers, but for me, translated to my country's currency, is a significant amount. However, there is a requirement for free account holder to log in at least once in 3 months, otherwise the account may be deleted. (Update: this is no longer a requirement as confirmed by writing to PhotoBucket, but they said they reserve the right to delete inactive accounts). Pro accounts are not subjected to this as long as you continue to pay the renewal fee. You can always opt for a paid (Pro) account which will cost you only USD25 a year or just slightly over USD2 per month, and you wouldn't have to worry about having to log in to preserve your account, plus you get higher storage limits, unlimited bandwidth, etc. Only thing you need to remember is to renew your subscription every year.

I don't know how big PhotoBucket is as I live half way around the globe from their headquaters, but my guess is it is a far cry from Google. Its survival as a business is dependent on getting sufficient income from paid accounts and from advertisements. Photobucket may be a big business, I do not know, but I don't think it come anywhere near Google. If the business goes, your photos goes with it. Blogger may close shop too, but then the blog will go with it, together with the photos, and at least one would not have posts hanging with no pictures displayed. However, PhotoBucket has the advantage of being able to upload videos as well. (Note: According to Rose Desrochers, Photobucket is a large company, so you may not need to worry).

Also, if you publish post with images hosted with PhotoBucket, you it will be good for you to be familiar with some basic HTML. Here is a screenshot of a photo hosted with PhotoBucket: Enviroman - an environmental blog. To put the image in your post, you will have to use the image tag <img src="URL of photo" alt="text" width="X" /"> (the URL is in the first box in photobucket. Height is automatically adjusted to preserve the aspect ratio if you leave out height="" and the photo will remain undistorted).

You must know the width of the main column. For this, you will have to get to the template editor window and look for the block of codes

#main-wrapper {
width: 400px;
margin-left: 20px;
float: left;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */

This is for the main column of this blog and tells me the width of the main column is 400 pixels, so the width of the photo must be 400px or less. You may leave out the attributes width="" height="" attributes if you want the size to be displayed the same as the actual image, or use Irfanview (click "BACK" button to get back to this page) to resize the photo before you upload it to PhotoBucket. The other way is to include in your tag the width you want for the photo, like <img src=URL of photo" width="395" /> or after loading, change to the COMPOSE mode and grab the corner of the image you see and drag it to whatever size you want, but it is not a method I would use. A little trial and error will be required here. Also, I am very careful about using the COMPOSE mode as if I have included some special code to display HTML codes, and the moment I chose COMPOSE mode, those get convert th HTML when posted, it wouldn't be displayed and I will have to redo the special characters all over again. A bit difficult to explain unless you frequently use such special characters to display HTML codes like I do, and I have to be very careful when I edit posts. This is one reason why Blogger give you the option of having COMPOSE mode or not for your post editor as if one is not careful and use the COMPOSE mode for posts containing special characters, the post will be altered and some characters may no longer be visible and will have to be redone all over again.

If you are lazy and don't want to write the HTML yourself, you can select the second option (Tag) in your PhotoBucket account where the HTML code is already written for you which you can just paste into the post, but in this case, clicking on the picture will not lead you to an enlarged version of the image, but back to PhotoBucket site, and the alt attribute describe Photobucket, not the nature of the photo. Further, you have to ensure that the image concerned has a width less than the width of the main column, or you will have to add in the width="" attribute (height will automatically be rescaled to keep the aspect ratio constant), or resize the image in the COMPOSE mode If the width of the photo is wider thant the width of the main column, it will send your sidebar sliding to the bottom of the page in Internet Explorer.

BTW, I have made the cartoon of Enviroman to be an active link. Try clicking on it and see where it leads you (guaranteed family safe). The actual HTML I used to make the image a clickable link is given below in the box:
<a href="" target="_blank"><img src="" alt="Enviroman Says - an environmental blog"></a>

For more control over how your image will be displayed, it will be good for you to learn the various usages of the HTML image tag at HTML Images (close new window to get back to this page).

Other photo hosts

A reader of this blog commented (See comments section) that he had frequent problems with uploading images (via Blogger, I presume) and uses or With his permission, I decided to check it out to see how good it is and update this post. The moment I landed on, I got not one, but two pop-ups. See thumbscreen (which by the way is hosted by imageshack (click to enlarge): Free Image Hosting at The advantages of imageshack are that you don't even need to get an account, you get the code for a thumbnail image as one of the many choices, codes to use in forums, etc. and they don't threaten you with deletion of your photos, only thing is if you ever need to use the uploaded image, you will need to remember where to go to get it (I think there is an option for you to register when uploading so that you can get back to the photos you uploaded). Anyway, if you use imageshack, I think it will be a good thing to copy the URL into Notepad and save it so that anytime you want it displayed on the Web, you have it. And they too have to generate enough revenue to stay in business, something that may not be easy in the Internet world where so many people are used to getting/using things for free.


Which method you use I suppose will depend on the circumstances you are in and your own preferences. If for example, you really is having problems uploading via Blogger, and you need to get the photo into the post urgently, I suppose you will have no choice other than hosting it with PhotoBucket, Imagedshack, etc. As for me, as far as possible, I will try to use Blogger, and occasionally PhotoBucket as I already have a free account.

There is also FlickR (owned by Yahoo). I have used it once to blog direct to Blogger, but didn't like it because it gave me few choices. You can also upload via Picasa, the Google photo software, and that host the photos on Blogger. You can get the Picasa software which is included in the Google Pact which you can download by clicking on the text link "Make your PC more useful. Get the free Google Pack" at the top of the right sidebar of this blog.

Items from Amazon

TAO 1-Inch Digital Picture Keychain (Square)

The Better Photo Guide To Digital Photography (Amphoto Guide Series)

Shoot Like a Pro! Digital Photography Techniques (Paperback)

Rick Sammon's Complete Guide to Digital Photography: 107 Lessons on Taking, Making, Editing, Storing, Printing, and Sharing Better Digital Images (Paperback)

d:book Digital 8x8 Scrapbook Kit - Green

Canon PowerShot Pro Series S3 IS 6MP with 12x Image Stabilized Zoom

Samsung SPP-2040 Digital Photo Printer ( Windows Macintosh )


Wednesday, November 01, 2006

What to do when your blog content is copied

This post is a result of an alert and some links given by Sherry of Helpful Resources for New Bloggers (close new window to get back to this page) that someone is copying contents of my blog Dummies Guide to Google Blogger. Rather than describing what to do, I will give an account of what I did.

At this thread How to use Google AdSense with blog (close new window to return to this page), I followed the link in his signature line, and found a couple of posts which are exact duplicate of mine. I went to the individual post pages (permalink) make screen shots (Printscreen) with Irfanview. See screenshots below (click "BACK button to return to this page).
The part above the fold of his post which he copied from mine

copied contentMy post from which he copied from (click screenshot to enlarge. Click "BACK" button to return to this page):my original which was copiedNote the differences in URLs and dates (27 October 2006 and 4 April 2006). To get the rest of the posts, I scrolled down and took a few more screenshots to show the similarity and saved them in a special folder. Further, I got the source code of his blog (in the menu bar, click VIEW and select PAGE SOURCE.This is for FireFox. Wording will be different in different browsers). I looked for the AdSense scripts and copied his AdSense ID (pub-7471417268818747). This is to collect evidences. I let him know that I know his ID. I requested him to delete the posts and let him know of the consequences if he didn't. All this was done politely (no point making enemies online). Eventually, he did remove the posts and apologised, and that was done quite promptly.

Lorelle did a very good article detailing what to do when your content is copied. See her article What Do You Do When Someone Steals Your Content (close new window to get back to this page). You should read what he has to say.

If you want to deter potential copy-cats, you can put a warning banner from Copyscape. For an example, look at this blog: Star Home Improvements (close new window to return to this page). The banner is right at the top, just below the header of the blog. To get the script for the warning banner, you can go to Copyscape (close new window to return to this page). You can get different formats of the warning banner to suit the part of your site you want to place it in. For example, this bigger square format: copycat deterrent banner. If you are using Blogger classic template, this post will guide you where to paste the script: Blogger template tutorial (click "BACK" button to return to this page). If you are using Blogger Beta template, to place it below the header (which I think is the best place to put it), see post Adding graphic to your Blogger beta header (close new window to return to this page). There are even bigger formats than the one I have shown, and if you feel that the banner shown are not prominent enough, you can choose the bigger formats for your blog to really frighten off the copy-cats.

Note: I have tried Copyscape, and found that it was not very effective. However, they have a Premium version and also automatic monitoring with Copysentry (which I presume are not free). You may get better result with those. If you are serious about protecting your content and don't mind spending some money, I suppose you can try it out. In any case, I think their banner is a good enough deterrent to warn potential copy-cats, and that is free.

You may also inform Google about the infringement at Digital Millennium Copyright Act - Blogger

Books from Amazon

Copyright: Examples And Explanations (Examples & Explanations)

Patents, Copyrights & Trademarks for Dummies

The Copyright Handbook: How to Protect & Use Written Works (Copyright Handbook)


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