Wednesday, May 21, 2008

How To Install Blogger Templates

How to Install Blogger Templates - Learn the way and method to install a Blogger XML template on your blog.

Do you want to know The process of using xml coding in blogger layout.

INSTALING BLOGGER TEMPLATES

Before you start going to change your template in the blogger, make it sure that you have already saved your old template XML file just in case you require to start again. And also make sure you have a programming-based html text editor installed on your computer system (to make the xml codes easier to see. And If you don't have one, you can download many free programming text editors or can use Notepad.

These are some basic instructions on how to put the Xml template in your blogger’s blog layout . There are some ways to do it; we will explain some of them, starting from the simplest methods.

For tips to improve template usage and common problems faced when installing these templates, read this post.


METHODS TO INSTALL BLOGGER TEMPLATES:

Method I. Simplest method - Uploading the xml file:
1. Download the XML template file that you want and save it in your computer (make sure it is saved as xml file).
2. Go to your Layout > Template > Edit HTML page.
3. Choose the file from the Browse... button, and then press the Upload button.
4. It may ask you to delete some widgets - so just delete them. (Widgets are the extra page element added to the sidebars).
5. You're done! View your new blog.
6. If the contents doesn't look aligned, that's probably because you don't have using any already widget on one of the sidebars - so add your widgets.

Method II. Copy-paste the template codes into the Blogger text editor:

If you don't want to download the file first, or prefer to paste the code into your Blogger editor, this is how to do it.
1. Open the template file that you want and copy all the codes.
2. Got to your Layout > Template > Edit HTML page.
3. Click the Expand Widget Templates (EWT) button. (If the EWT button is on or clicked, all template codes will be visible; if it's off or unclicked, then some codes related to Blogger Data are hidden so that the HTML codes look less messy - most of the time, you don't want to change or add codes inside the Blogger Data area).
4. Select all the codes in your Blogger editor and delete them all. Then paste the codes for your new template.
5. It may ask you to delete some widgets - so just delete them. (Widgets are the extra page element added to the sidebars).
6. You're done! View your new blog.
7. If your contents doesn't look aligned, that's probably because you don't have any widget on one of the sidebars - so add your widgets.

Method III. Copy-paste the CSS styling only into the template code:

The annoying part about using the above two methods is that you have to properly delete some widgets that you've made (maybe you have some Adsense codes, Text contents, HTML codes - usually these widgets Labels, Blog Archives, About Me, are not deleted). If you don't want this to happen, you should copy and paste the CSS styling part only. By changing the cascade style sheet, CSS part only, you don't change anything related to the Blogger Data including the data about the widgets that you've made.
CSS styling is the code that controls everything about the template style or appearance - the font size, colors, background images, header size, post layout, sidebar size and locations, etc.
But to do this is a bit tricky. You have to make sure the basic layout of your old template with the new one is the same. For example, if the old template has 3 columns (2 sidebars and 1 main), your new template has to be 3 columns too. The arrangement of columns will follow the old template; for example SMS or MSS or SSM. If the old and new templates don't have the same content layout, it won't work! If you're not sure about this, just use the first 2 methods above.

If you still decided to change the CSS part only, read on below.

In the blogger xml template, look for the coding in between the b:skin tags. In my templates, I've labeled the start and end of the CSS styling part. (In the code, the 'Page structure tweaks' code are actually part of the CSS styling too, but just leave it there.)

So, these are what you need to do to change the CSS part only:
1. Open the xml template file that you want and copy the CSS styling code only.
2. Got to your Layout > Template > Edit HTML page.
3. Don't click the Expand Widget Templates (EWT) button because you don't have to change the Blogger Data code.
4. Select the existing CSS styling codes in your Blogger editor and delete them. Then paste the codes for your new template.
5. It may ask you for the delete some widgets - so you just delete them. (Widgets are the extra page element added to the sidebars).
6. You're done! View your new blog.
7. If it doesn't work, you should always use the first 2 methods above and add the widgets later.

2 comments:

Sarah said...

If I delete my widgets for a new template, will I be able to reinstall them afterwards?

Anonymous said...

Thanks mate.