Blogger Tutorial (5/6): How to Install a Custom Blogger Template

alt="Blogger Tutorial (5/6): How to Install a Custom Blogger Template" src="http://whsr.webrevenueinc1.netdna-cdn.com/wp-content/uploads/2015/04/default-image-500x308_c.jpg" />

Hi once again. Remember not long ago we explored href="http://www.webhostingsecretrevealed.com/blog-hosting/blogger-tutorial-46-must-have-addons-for-your-blogger-blog/">some nice gadgets and addons to enhance your blog? Now we are going to go one step further – customizing your blog template!

In href="http://www.webhostingsecretrevealed.com/blog-hosting/blogger-tutorial-26-setup-your-first-blogspot-blog/">Tutorial 2/6, we used the Blogger.com’s standard template “Minima” and our blog looks like this now:

src="http://www.webhostingsecretrevealed.com/images/2010/0118-1.jpg" alt="" class="border" />

Yes yes, I can hear everyone complaining how dull it is already! But fear not, we are going to transform this blog into something much more interesting and wonderful at the end of this post. Before that, let’s look at how other people tend to customize their website/blog template. How about we begin with this site – WebHostingSecretRevealed.com?

Design of Web Hosting Secret Revealed

src="http://www.webhostingsecretrevealed.com/images/2010/0118-2.jpg" alt="" class="border" />

1. Blog Title with Logo (should be easily interchangeable)
2. Home button to let reader return to the main page
3. Other useful links to be put at the top

Actually, this is a much adopted approach for the web nowadays. This layout gives the reader a totally neat and “user-friendly” feeling. You could see many more examples around:

Design of EnGadget

src="http://www.webhostingsecretrevealed.com/images/2010/0118-3.jpg" alt="" class="border" />

Site link: href="http://www.engadget.com/">http://www.engadget.com/

Design of CNN

src="http://www.webhostingsecretrevealed.com/images/2010/0118-4.jpg" alt="" class="border" />

Site link: href="http://politicalticker.blogs.cnn.com/">http://politicalticker.blogs.cnn.com/

Getting into action: Installing K2

We are going to use this approach to customize our blog. To begin, let’s head over href="http://www.eblogtemplates.com/k2/">here to have a look at a very popular blog template called href="http://www.eblogtemplates.com/k2/">K2. This is what we want! Customizable title and background picture with tabs underneath it, awesome. Now download the template:

src="http://www.webhostingsecretrevealed.com/images/2010/0118-5.jpg" alt="" class="border" />

The file downloaded is “k2-blogger.xml”.

Now, from your Dashboard, you’ll need to get to Layout>Edit HTML. Before we begin any modification to your blog, let’s be on the safe side and backup your current template, haha! Just in case any “unfortunate” events occur, at least we could revert back to the old one.

src="http://www.webhostingsecretrevealed.com/images/2010/0118-6.jpg" alt="" class="border" />

1. Backup a copy of your current template (the file would be “template-somenumbers.xml”)
2. Choose the file “k2-blogger.xml” that you’ve downloaded just now
3. Upload the new template to the system

OMG!!! Your blog just magically transformed into a beauty!

src="http://www.webhostingsecretrevealed.com/images/2010/0118-7.jpg" alt="" class="border" />

Still, this is not perfect yet. The downloaded template consists of some tabs and links that we will not require for our blog. Hence, some minor modifications are still needed. We could even change the title background to something we fancy. Just follow the below tips to make everything go your way. :)

In Edit HTML page, tick the Expand Widget Templates checkbox, and be in the Edit Template column to do this:

src="http://www.webhostingsecretrevealed.com/images/2010/0118-8.jpg" alt="" class="border" />

Change the highlighted link to the link of the title background image you would like to use.

src="http://www.webhostingsecretrevealed.com/images/2010/0118-9.jpg" alt="" class="border" />

Edit these codes to change the tabs to the links that you’d like to display.

Tada! Have a look at the href="http://equantravels.blogspot.com/">customized blog now and compare it to the previous layout. Wonderful isn’t it?

To experiment with a variety of different templates, give these links a try:

type="disc">

href="http://www.eblogtemplates.com/templates/blogger-templates/">Eblog Templates

href="http://www.chethstudios.net/2009/01/roundup-of-best-blogger-templates.html">Cheth Studios

href="http://www.mintblogger.com/2009/01/25-best-magazine-style-blogger.html">Mint Blogger

In the next and final installment of this Blogger Tutorial, we’ll be learning how to use some analytical tools/statistic counters to analyze and understand where our blog readers come from, what they are interested in, and how all these data could help you improve your blog contents and increase your readers. Till then, adios!

About the author

id="floatright">src="http://www.webhostingsecretrevealed.com/images/2009/0824-5.jpg" alt="Blogger Signup" />