Tutorials on Blogger Template Design
Blogger Template Design: Introduction
This tutorial is a very quick guide to teach you how to change or design your own Blogger templates. It's easy to understand and follow, especially to those who has no knowledge in HTML programming.
The tutorial is split into a number of sub-tutorial modules that explain specific parts of Blogger template design in detail. The best way to learn is by going through the module sequence one by one. But if you are familiar with the basics, you can jump into the more advanced modules. The earlier modules are focused on explaining the basic structure of the template design and the template code so that you understand more about a Blogger template in general. The later modules explain each section of a Blogger template in more detail and help you go through the process of coding and designing a template in a step-by-step approach.
In the tutorial, some of the names and terms are based on my own template design, but I'll explain them as general as possible so you get the bigger picture and can adapt to different template designs.
Tutorial Contents
- Tutorial 1: The Structure of a Blogger Template
- Tutorial 2: The Structure of a Blogger Template Code
- Tutorial 3: The Structure of CSS Styling Section
- Tutorial 4: Setting the Properties of a Container
- Tutorial 5: Common Containers and Elements in a Blogger Template
- Tutorial 6: Using the Generic Blogger Template
- Tutorial 7: Setting the Template Size
- Tutorial 8: The Body Section of the Blogger Template Code
- Tutorial 9: More Explanation about the Body Code
- Tutorial 10: Making a 3-Column Template and More ...
- Tutorial 11: Starting Your Own Blogger Template
- Tutorial 12: How To Embed Images as Background


8 comments:
This is a wonderful tutorial, I have always wanted to know what such things meant. The color coded template is a good way to learn Blogger Template customizing. Thanks for the great service. Cheers,
Thanks for your input. I've got more things coming for the tutorial, but still on hold for now so that i can build more templates. i'll posagain on tutorials after 30th templates.
Thnak you for the tutorial.
Thank's for your templates, very good and very nich. I want to get information from you about:
"Inside your blog was templates sample (format jpg), how to make its.
Thank's
Azhari (Indonesia)
Trima kasih Azhari,
I wasn't sure about the question, but I think you're refering to how I get a snapshot of my template and put it as JPG, am I right?
To do this, I use a graphic viewer software (I'm using the free IrfanView). Open the page that you want to copy, then open the IrfanView. Go to Option and choose Capture Screenshot and follow the direction. You'll then get a picture of your full screen including the picture of your blog page. Crop the picture to get rid of the screen picture, leaving just the image of your blog page.
Hope this helps.
10x 4 wonderful tutorial
lots of info, I found 1/2 of what I was looking for and da other 1/2 is a tutorial about converting WP template to blogger.
will I see any help!!?
Cheers bro
Hi Jan. Thanks for the comment. About WP, I haven't use them and not sure how to convert them. If I were to convert one at this stage, I'd use all my knowledge in Blogger template design and try to imitate the WP template by looking at the features one by one and rewrite the code. I'm not sure how to convert the code directly. Thanks again.
Great tutorials thank u very mush
Post a Comment