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" />

Blogger Tutorial (1/6): Introduction & Getting Started

alt="Blogger Tutorial (1/6): Introduction & Getting Started" src="http://whsr.webrevenueinc1.netdna-cdn.com/wp-content/uploads/2015/04/default-image-500x308_c.jpg" />

I know some of you guys are keen about blogging but unwilling to spend extra on web hosting and domain. The good news is there are tons of great blogging platform around and they are absolutely free. One of the top rated blog platform is of course Blogger.com manged by Google. For the next few weeks (or months), I’m glad to have experienced blogger E-Quan on board to share his experience and knowledge in operating a Blogger blog. I’m sure his tutorials bring great joy and valuable information, so stay tuned and have fun learning!

Blogger: Introduction & Getting Started

So you’ve decided to start a blog, great! I bet you have plenty of thoughts, ideas, or even wonderful photos to share with close ones and the world. What better way of doing that than writing them down, publishing them easily, and at the end, archiving them systematically using Blogger (href="http://www.blogger.com">www.blogger.com)?

A little history about Blogger

Blogger is one of the earliest blog publishing systems and was created by the nice people over at a small company called href="http://en.wikipedia.org/wiki/Pyra_Labs">Pyra Labs in San Francisco back in August 1999. To make the great story short, Google eventually saw the potential that was hidden in this blog publishing tool together with its many great features that it formally acquired Pyra Labs in February 2003. Blogger has now emerged as one of the most successful blog hosting providers offering many wonderful features with a user-friendly interface — for FREE!

Blogger when it was first launched

class="border" src="http://www.webhostingsecretrevealed.com/images/2009/0824-3.jpg" alt="Blogger when it first launched" />

Blogger now

class="border" src="http://www.webhostingsecretrevealed.com/images/2009/0824-2.jpg" alt="Blogger nowadays" />

The basics of Blogger (and some example)

Basically, your blog will be hosted by Google at subdomains of blogspot.com.

What this means is that you could choose a unique name that is meaningful to you and your readers and publish your posts at that address (provided that the name is not taken up already!). Like this author, he also uses Blogger service and his blog is available at confirmcekap.blogspot.com. Many people use their own name/nickname as the URL and one famous blogger whose blog is being hosted on blogspot that I can think of right away is XiaXue (href="http://xiaxue.blogspot.com" rel="nofollow">xiaxue.blogspot.com).

class="border aligncenter" src="http://www.webhostingsecretrevealed.com/images/2009/0824-4.jpg" alt="Xia Xue" width="560" height="413" />

Pros and cons of Blogger

Besides Blogger, there are actually many blog hosting providers out there in the wild: href="http://www.wordpress.com/">WordPress, href="http://www.livejournal.com/">Livejournal, href="http://www.live.com/">Windows Live Spaces, to name a few. Before registering at Blogger.com, you might want to know the pros and cons from my own personal experience:

Pros:

• FREE!
• Fast and simple registration/setup. Even more so if you already have a Google account (Gmail for example).
• User-friendly interface (referred to as the Dashboard) — easy to navigate between Editing, Settings, and Layout. Even a drag-and-drop feature to arrange your blog’s layout!
• Labels option for your posts — meaning that you could categorize each post for example: travel, food, rants, etc.
• Easy to add photos/videos to your posts.
• Comments system is also available for you to gather feedback from your readers.

Cons:

• You don’t own nor can you control the site because it is free and being hosted by Google. Your blog can be blocked/deleted by Blogger if they judge your content being in violation of its Terms of Service.
• Multiple pages are not supported by Blogger currently. Your Blogger blog is not like a website where every page created has a new link/URL. You create posts instead. In short, it is not possible to create yourblog.blogspot.com/location where this page will contain your address with a nice hand-drawn map.
• The basic layout templates offered when you first register are pretty dull and if you’d like a more sophisticated layout, some research is definitely required.

Should you go with Blogger?

All in all, I still recommend that you try and start your blog at Blogger because as you can see above, the advantages are still quite significant. Click the Blogger’s logo below to start your blogging journey right away!

p/s: In the next session, we’ll be discussing about setting up your first Blogger blog and configuring it to fit your requirements.

About the author

id="floatright">class="alignright" src="http://www.webhostingsecretrevealed.com/images/2009/0824-5.jpg" alt="Blogger Signup" width="100" height="97" />

Blogger Tutorial (2/6): Setup Your First Blogspot Blog

alt="Blogger Tutorial (2/6): Setup Your First Blogspot Blog" src="http://whsr.webrevenueinc1.netdna-cdn.com/wp-content/uploads/2015/04/default-image-500x308_c.jpg" />

id="floatleft">href="https://www.blogger.com/signup.g">src="http://www.webhostingsecretrevealed.com/images/2009/0824-1.jpg" alt="Blogger Signup" border="0" />