Knowledge is good only if it is shared. As a new blogger, I had learned to change the Web template, and found out the tips, tricks, hacks, and tweaks of altering the Blogger template, customizing CSS, widgets, layout, blog design, inserting JavaScripts, HTML codes, Google AdSense, and other settings the hard way, through many trials and errors. For the purposes of this guide, I had started with the old Blogger “Minima” template. As I made the changes or learned something new, I had documented them. Before changing any template, please remember to save a copy of the current template. After editing the template, preview it, and save it when you are satisfied with the change. Hope this guide will help those who are finding the way around, just like me.

Search Tips for New Bloggers

We have extended our month-long vacation by a couple of days. We shall be posting articles the moment we return. We noticed that Google had updated the Page Ranks. New bloggers who have been waiting anxiously for this can check their blogs' Page Ranks. We have the PR checker link in our SEO Tools - Search Engine Optimization article.

The blog we created recently in Aug 2007, Blogger FAQ and Help, has also got its first Page Rank, a PR4. All our blogs are now ranked:-

Tips for New Bloggers - PR6
Business Fables and Management Lessons - PR4
Famous Motivational and Inspirational Quotes - PR4
Blogger FAQ and Help - PR4

Thanks to everyone for the support!

Oct 9, 2007

Digg This Story

Difference - HTML and XHTML

When inserting codes into the Blogger template, page element, or blog post, you may have seen error messages that the code could not be parsed, was not well-formed, was broken, or that the elements were not closed properly. These errors can be corrected if you understand the rules that must be adhered to in XHTML documents. Blogger templates use the XHTML 1.0 Strict Document Type. In this article, we shall explain some of the XHTML syntax or rules, so that you may troubleshoot and resolve the problems if these error messages should occur.


We shall keep this short. Just so as you understand what we said about document type, view the Page Source or Source of your Blogger blog. You should see this document type declaration at the very top:-

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "">

The terms – XML, HTML and XHTML - refer to the markup language used to write the web pages. Many of us would have heard of HTML (Hypertext Markup Language), invented by Tim Berners-Lee, and used since the early days of internet. XML (Extensible Markup Language) is a meta-language, used to create other markup languages. The traditional HTML was later recast to use the rules of XML and that resulted in a new XML application, called XHTML (Extensible Hypertext Markup Language). Because XHTML rules are strict and unforgiving, not conforming to them when attempting to modify the template would result in error messages. So, what are these rules that Bloggers like us should take note of?

Basic Rules of XHTML

1. Codes to be in lowercase

Since XML is case sensitive, all the element keywords and attribute names used in XHTML should be in the lowercase. For example, the template code is not this:-

<TITLE>Tips for New Bloggers</TITLE>

but this:-

<title>Tips for New Bloggers</title>

If you have noticed, the elements and attribute names between the lesser than (<) and greater than (>) signs have to be in the lowercase. However, the value, which in this case is “Tips for New Bloggers”, can be in the uppercase, lowercase, or mixed case.

2. Attribute values to be in quotation marks

All the attribute values have to be enclosed either in single or double quotation marks. The following examples are not accepted by XHTML:-

<div id=header-wrapper>

<a href=>Text Link</a>

<img src=photo.jpg/>

<table width=200 border=0 cellpadding=2>

Instead, they should be written as such:-

<div id='header-wrapper'>

<a href="">Text Link</a>

<img src="photo.jpg"/>

<table width="200" border="0" cellpadding="2">

3. Container elements must have closing tags

This is not correct:-

<p>A paragraph.

In XHTML, there must be a closing tag with a forward slash (/) at the end:-

<p>A paragraph.</p>

Examples of the many non-empty elements that have opening and corresponding closing tags are:-

<ul> ... </ul>
<li> ... </li>
<table> ... </table>
<h2> ... </h2>
<div> ... </div>
<span> ... </span>
<dt> ... </dt>
<dd> ... </dd>
<a href> ... </a>

4. Standalone elements to be closed

Some of the elements are empty or standalone. They do not have associated closing tags. Common examples are:-


Nonetheless, in XHTML, these elements must be terminated or closed. There are two ways to do that. One way to terminate the element is to put a forward slash (/) at the end like this:-


The second way is to add a corresponding closing tag like this:-

<br> ... </br>
<img> ... </img>
<input> ... </input>
<frame> ... </frame>
<hr> ... </hr>
<meta> ... </meta>
<link> ... </link>

5. Elements to be properly nested

This means that elements must be closed in the reverse order. For example, this code is not accepted in XHTML:-

<form><table> ... </form></table>

It is improperly nested because the form was created first followed by the table. To close them in the proper order, the table must be closed before the form, like this:-

<form><table> ... </table></form>

6. Document to have only one root element

In the XHTML document, you will see that except for the document type declaration, all the codes are nested between <html> and </html>. This is the root element and all other elements or sub elements are in between. The document structure will look like this:-

<head> ... </head>
<body> ... </body>

7. Attribute minimization is not allowed

In XHTML, all attributes should be in the form name="value". Even if the value is the same as the name, it cannot be minimized to one word. Hence, in our Add Text Box and Textarea article, the textarea code is not this:-

<textarea readonly>Hyperlink Code</textarea>

but this:-

<textarea readonly="readonly">Hyperlink Code</textarea>

XHTML Character Entities

Quite a number of readers had asked why they were unable to display HTML codes in their blog posts or why their codes were not well-parsed when inserted into the template. If you have noticed by now, the codes are wrapped in the lesser than (<) and greater than (>) signs. The moment these are posted, they will be interpreted as codes and will trigger an action by the browser. Should you want to display these as part of the text, use their character entities instead.


The next time you see an error message to the effect that the code is not well formed, not well parsed, not properly closed, etc., take a look at this guide, troubleshoot the problem and try out the possible solutions.

© Tips for New Bloggers

Found this article useful? Mention us in your post, subscribe to our feed, link to us, or bookmark this site. Thanks for your support!AddThis Social Bookmark Button


Support said...

Hi there,

Nice stuff you got, very interesting to read.
Well, I do have also in my sleeves, if you have time don't forget to visit

Many thanks

Jos said...

Great Blog! Thanks. I mean: thanks!

Anonymous said...

Hi there,

This may not be relavant to the topic of your post but I would like to ask you regarding the sub-domain.

There are many nice blogspot sub-domains being taken but the blogger(s) have not been posting anything for, say more than 12 months or some even more than 2 years or longer.

May I know can we write to to request for taking over the ownership of the sub-domain?

What's your opinion on this issue.

Any suggestion?

Thank you.

bizwhiz said...

Hi Anonymous

If you are asking an official question, I suppose it would be best to direct it to the Blogger team itself.

car parts nanny said...

This is a great post since there are still new bloggers coming everyday and some of other bloggers still don't know about this thing.

Anonymous said...

Good piece. I learned something.
But I have a question.

What is the proper code for an internal comment (for example I want to identify the code that follows only for my own use so that I know what the dickens it was/is

Lary Crews

bizwhiz said...

Hi Lary Crews

In the template, it would be this:-

/* Your Comments */

fly said...

Hi bizwhiz,

May I know how could I centralize my blogger template?

This is my blog,

The default alignment is to the left and I don't know how to centralize it.

Your help is very much appreciated.


bizwhiz said...

Hi fly

Read the article in our Blogger FAQ blog on Center Alignment of Page Elements.

lorainek said...

Hi great site really help me! with your tips I can actually manage to work things out! Ive added you to my favourite links!to let other people know about you.

de_naturaleza said...

Hii there...

Your template is simple, but your posting info is very helpfully for newer blogger like me.
there is much tutorial and trick for blog that usefull for me

Nice Blog with great job...congratulations!!!, ...

I'm new commer in blog..., please be acquainted with here same my blog:


I have also some new template in e-linknet that best of mine, that create from HTML.
What do you think about my blog, in design template, article and do you have any comment for my blog posted???

thank...before for link my blog...


nice to know you

The Story Brewer said...

Hi.. you have put up a great blog for novices like us :-) Anyways, I have a query relating to positioning of banner at the top. My blog is
You will notice that there is no space between the header image and the ad banner at the top, nor there is any space between the header image and the google adsense unit in the right sidebar. Can I insert some space say 5-10 pixels in between?

Johann The Dog said...

Fabulous tips! Thank you so much for the information. Woofs, Johann

bizwhiz said...

Hi The Story Brewer

Space can either be in the margin or padding settings. Try adding values in them and preview the blog to see the effect.

Anonymous said...

Hey Bizwhiz! I wanted to know if you know a way to put this banner

In my blog... I only have the url and I just really want that banner on my blog!


bizwhiz said...

Right click on the banner to view or download. However, be aware of copyright issues if you intend to use the banner on your blog. Get permission from the site owner where necessary.

Saç Bakımı said...

Thank you.

ahmed said...

i think great post.

Jesieblogjourney said...

Excellent tips for bloggers like me.

I have used your guide to create a third column to my two column blog. It looks a little cluttered. I am thinking whether it is possible to change the color of the middle column so that it looks better. I will appreciate your guidance.

Thank you so much.

bizwhiz said...

Hi Jesieblogjourney

I don't seem to see three columns in your blog. There is a missing } which should appear after this:-

div#newsidebar {
margin:20px 0px 0px 0;
float: right;
width: 15%;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */

Add the ) and preview the template. As for the color, try adding the color code under this:-

div#main {
background: #FCDFFF;

Look at our color code chart for the color code.

Sophie LC said...

At last, technical stuff explained simply, I will come back to this blog, but for now I am adding it to "my favourite websites" in my blog!

kaptan said...

beautiful and very useful blog, congratulations! Waiting for new tips!
Especially some up-to-date tips on SEO for blogs! küresel ısınmaya hayır seo yarışması

Mark said...

Thanks for offering so good information and it's so helpful for new bloggers. When I started my first blog I was trying to change my template :) and your blog helped me. I am not saying the blog I am posting now but my first blog. I know about this blog from google.


Ankur Shanker said...

Hi Bizwhiz!

First of all.. you are doing a great job and I have greatly spruced up my blog with your tutorials. My blog is

You will notice that I have put up an image at the top by choosing the option ADD IMAGE INSTEAD OF BLOG TITLE AND DESCRIPTION. And so the blog title and the blog description do not appear in the HTML code. My question is: Is there a way such that I'am able to enable the blog title and the description BUT they are not visible on the image? They could be hidden or made transparent.. anything?
I am asking this because Google Adsense selects advertisements primarily on the basis of meta tags which include the blog's description also. In case, it does not find the relevant ad it shows Public Service Ads.
It is these PSAa which I dont want to appear on my blog. And one of the methods to do so is to include blog's description somehow in the html code.

Hope you have understood my problem..

Anxious to hear back from you :-)

Amit Kheterpal said...


Amit Kheterpal said...

Hi there,

I am starting my new blog called blogger Interviews( and I would like to interview you for two things , one that you are a famous blogger and achieved quite a degree of success and also that I am only targeting A-list bloggers, I am trying hard not to dilute the brand equity of the Blogger Interview blogspot.

I will send you my questions which I will publish once you answer them. I will let you know when I will publish your post and also you may mention that in your post if you wish to (entirely upto you) and you can put some excerpt of the interview and not the whole(well if you put the whole interview it will be professional blasphemy) .

Believe me this is no scam and also I am not proposing it to be for everyone and it will be for only top notch bloggers .

By the way my introduction is that I am Amit Kheterpal, working in a finance company as a technical project manager and also now a convert to blogging . My initial effort is not a worth see but I did put a few websites together just to learn the basics.
here is my main blog..
My emailID is

Thanks and a Merry Christmas

HELPME said...

Heeey... this doen't have anything to do with this,but can u help me makemy blog look like
I really dont know anything about html and all, and I REALLY need help.
contact me with

Girl-Woman said...

Oh, Peter, you truly are the Grand Poobah of Blogger. When I validate the url in Feedburner it says to avoid namespace prefix xhtml. When I click on "help," it says to employ xmlns=. What to do? Your unworthy friend, Girl-Woman/court reporter.

4ALL2ALL said...

A great post! Thanks for sharing.

mdouble said...

I've been having trouble adding bookmaking icons to my blog posts. I was indeed getting error messages as you noted in this post. I had become frustrated but now, having read your post I have a much better understanding of what's wrong. Thanks for some very good information

silfiriel said...

just stop by to tell you that your blog was very helpful.I finally got my blogs designed as I wanted. Thank you very much.

karen (akaliz) said...

i know this is an old post, but i'm so glad i found it!

many thanks for all your help. i've always wanted a 3-column blog and now i have one!

i've also linked to you. hope that's ok!


SandyVTW said...

Love your tips, I've linked to you on my blogs and on digg. Thank you :)

Web Design said...

Very nice and perfect comparison also simple and easy to understand. Thanks for effort.

OOM said...

Thank you, very good tips. Blog bookmarked!

liza said...

ohh this is great I blog for 6 months now but I still having a hard time figureing some Css code..great blog by the way and very informative too..

Chea-Lie Heng said...


it is very interesting
offering this article

SAP BW, Business intelligence Blog

cdwillis: said...

I am curious; is it possible to have your blog posts posted from left to right instead of top to bottom. Like:

NewestPost SecondnewestPost Links

instead of:
NewestPost Links
SecondNewest Post

logo design said...

nice post. i have a logo design blog and often need to work with blogger templates. it would help understand and work with ease. thanks.

Anonymous said...

Thanks! Thanks for the detailed description for all the beginners. said...

Thank you very much. Very helpful Blog.

TV de LCD said...

Hello. This post is likeable, and your blog is very interesting, congratulations :-). I will add in my blogroll =). If possible gives a last there on my blog, it is about the TV de LCD, I hope you enjoy. The address is A hug.

Girl-Woman said...

Oh, do I need help. I have transformed my blog with your help. I have fiddled with my code so much that I think I lost something, though. Google Webmaster cannot verify my site, even though I think I have it inserted correctly. I would be more than happy to pay for your services to take a look at my html code to make sure everything is friendly. My site is Girl-Woman-Beauty-Brains-Blog and my email is Any help that you can give me will be truly appreciated.

williamhessian said...

good tips... but

Stop trying to beat me!

Bloog Blog Cherry

Steph said...

Do you have any good ideas for printing off a year's worth of a blog in a clean blogger format?

Jodi said...

Love your blog! Thank you so much for sharing! Is there anyway you would share the widget for you quote of the day? It is the best one I have found...that is IF it changes daily on it's own. I would really appreciate it!

Anonymous said...

great tips for beginners thanks for sharing

small business idea

Linilla said...

I didn't know about closing the tags that didn't need closing in "old" HTML. Thanks for the tips!

Miss Lobelia said...

Good morning, Just wanted to say thank for providing this great service. I have been wanting to personalise my blog and thought I would have to pay someone. You have just saved me some money and thought me about HTML ;O)

jobmaldives said...

Very informative. Good stuff. Very Supportive, well done. Thanks a trillion

sam said...

We were unable to save your template
Please correct the error below, and submit your template again.
Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly.
XML error message: The content of elements must consist of well-formed character data or markup.

Melting Snowman said...

Good explanations for non-web coders.

I see that blogger uses the "strict" doc type, but when I use a validation service, e.g. complains about:
* the attributes of the iframe displaying the blogger header.
* all links use & for parameters instead of & amp; as would be expected in pure XML.
I thought of changing the doctype header of my template to "transitional" to get rid of warnings. Or do you know a way to fix this errors?

jhon said...

i think it,s a great post.

You Wealth.Com

UnderHeavens said...

WOW!! Amazing stuff you have there. I jus' luv it!!

Could you plz guide me or write an article on how to allign Buttons on blogspot. for example, i have two buttons, one for Technorati other for stumbleupon. Now, how can i make them appear on a single line ( just one line, side by side) Hope you got my point.

Plz let me know if you have any idea on how to fix it


Metaspring Blog said...

My first time here. Yours is a very good blog with excellent information shared in a very simplified tone. I'd like to invite you over to my blog too where I share information about similar topics with my readers.

Search Engine Optimization said...

Excellent blog! really interesting

web designer

Anonymous said...

hey nice post about the HTML and XHTML,im in a web site design company, and having your blog as an update reference,. keeps my job much easier, thanks, keep it up....

web pixy said...

Very useful article, thanks a lot! It says everything you need to know about HTML and XHTML!

-J said...

Nice, alot of good information in here. Gotta browse your other posts also.

Anonymous said...

Hi, I came through your site , I really don't wanna sound like spam but hey, would you like to link my site, we are emerging SEO Specialists / PHP developer from India, I’ll show my link love to you from my Pr5 sites :)

Let me know if you are interested.


Email: -

blazingpretzel said...

One note on self-closing tags:

You said that for tags such as <br>, one should format it like this: <br/>. However, for maximum compatibility, one should put a space before it closes like this: <br />

StockFanatic said...

Hi, i enjoy reading your blog and i have learnt many things from you guz...
However, i have a problem. My blog;
if you scroll to the bottom, the 2 sidebars are not align to the center content page. How do i solve this problem, hope to get a response from you soon. You can send me an e-mail at Thank you!!


Anonymous said...

Please help me to put two large rectangle one beside other after the blog post title in my blog famous pharaohs

Bonnie said...

Thank you, thank you, thank you!!
This is by far the VERY BEST help for bloggers I have found ANYWHERE. Thank you for your time and your willingness to share. I have posted a link on my little blog for all of my new blogger friends!!

özbekistan uçak bileti said...

very useful for me ,thanks

azim said...

can i know hou to add top tab column on minima template?

Free Blogging Sites said...

Great man... virtually it is a great help for new bloggers and very useful.

naza said...

i a new blogger.. so i whom learn html tq..


Voucher Codes said...

I am glad to know about these html and xhtml in detail.

Anonymous said...

hi there

Pinoy Jobs said...

I love your blog! thanks for the tips!

indra fansblogs said...

Hi.. whether we could be friends and exchanged link?

goooooood girl said...

Very fine......

Poze said...

thanks for sharing, very good stuff there...

lia said...

First off thanks for your how-to's. I've learned alot.
I have a question:
Is there a propety which acts as a color, that lets the background show through a bit, like under a film?

Gis said...

Great blog! Just left a link so my readers get some answers they have been looking for! Thanks for the knowledge sharing!

Nihaar Gujjar said...

Hey first of all you have a great blog and it is grateful tht u share it with us. I have a question how do i code my text in blog posts i mean the way u have boxes with HTML and XMl codes in ur posts..when i try using it directly blogger gives me an error.

Bollywood Paradize

meno said...

I successfully added a third column to my blog with your help. Thank you.

Have you written about how to customize the comment box? I want to change the words "Leave Your Comment" to something more amusing. I searched my code for those words, and cannot find them.

kunstacademie said...

I really dig this blog! Thank you very much!

M said...

I'm wondering how to show on my blog who links to my blog. I have seen this available through Technorati but can't seem to find how to do it.

Any help??? Thanks!

sunny said...

Thank You Sir,
about sharing the knowledge ,i will be seeing ur's whole site and i will make mine blog as lookable by using u r's tips and ideas and making beautiful blog.

Nirose said...

Thanks for the share. greeat

Ray The Money Man said...

Thanks for your help. I find myself referring to this post again and again.

Muhammad Afandi said...

Wow, hi biz whiz, ur WICKED!

I mean thanks for explaining simply, you ever thought of teaching as a career? pedagogy to the next level!

Jokes aside. I've been reading and you know alot. Please contact me at, I need to ask some questions.

Thank you.

Webdesign said...

Very good informations. Thanks for sharing your knowledge. Thats amazing.

helpfulltips said...

nice blog and stuff helpful for all user, nice STUFF thanks

tyas said...

wow... this is what i've been looking for..
now i can edit my template easily..
thanks a lot!

Subhra said...

Really it is a unique Bloggg...!
But can plz tell me,i have inserted one html code into my 'edit html'tag.But unluckly it is not saved on that,and one message was appear:-We were unable to save your template
Please correct the error below, and submit your template again.
More than one widget was found with id: HTML1. Widget IDs should be unique.,>
but in my other blog,it saved nicely,plz reply me.THANKS A LOT.

Siladitya said...

good blog.
BPO work from home

sagar said...

Really awesome blog. I enjoyed reading review of bloggers tips, tweaks, hack etc. I found that you really update your site regularly that made me more interesting. I've bookmarked your site for my future use.

Thank you
sagar rai
Cool Gagdet Zone
mobile pc tips tweaks
Orkut Free Themes
Free CSS templates

All the best to ADMIN of this blog / site..

workhard said...

ur blog is very interesting
thanks for the information. i am a new user. helped me a lot

Vibrationstraining said...

Many thanks. The informations are very useful. Keep on doing...

4ALL2ALL said...

Merry Christmas & Happy New Year from Vietnam.

forALLtoALL's Community

idotkontji said...

still confuse with html adn xhtml... this blog is now my own teacher,,, thx...

jhon said...

Great blogs cool dear There are many nice blogspot sub-domains being taken but the blogger(s) have not been posting anything for, say more than 12 months or some even more than 2 years or longer. you can get more information from this.

jhon said...

Excellent very interesting to read.
Well, I do have also in my sleeves, if you have time don't forget to visit, ,
you can get more information from this

Happy Heart Princess said...

thank you for this resource material! I am still struggling with html, etc., etc., - this is so helpful!!!

web hosting said...

Isn't HTML a thing of the past now? I guess for newer browser writing XHTML compliant code is becoming a must. You cannot ignore simple rules now.

Gossimer said...

Visiting your blog is a true owner, I get to know plenty of things that matter to me, I really appreciate your work! Keep posting the way you have always been! thanks.

madine said...

nice blog

managed hosting said...

Great post!! Very helpful especially to beginners.. Thanks for sharing.. :D

saleel said...

Hi Nice blog yours!
My blog also deals with games.
Any interest in exchanging blogroll links with a PR2 bog?
If yes, please make a comment on my blog.
I will add your blog to my blogroll first, then you can add me.

sp2kxn said...

thanx mate !

Alexa Dagostino said...

I think this is very interesting blog. I'm a web designer so I don't have a problem with coding my own blog/entries, however I always do get a lot of questions from my clients and end up doing it for them because it really can be complicated. When it comes to using a regular template I do feel that people should be able to learn how to do it. Nevertheless, when things are wanted to advance and customize I do feel a web designer is needed. What are your inputs on the designer world?

termitex said...

is this blog dead?

Je@n1te said...

I love your blog :D Thanks!

project management said...

Very informative and helpful post... thanks for sharing... :D