Basic Structure Of a Blogger Template 118 Comments

Before deigning a template you must have a clear idea about the basic structure of a blogger template. All templates are not same but by knowing this you can easily edit or modify anypart of your blog.
 
Some parts of the template structure are obvious from what you can see on most blogs: the headers, footers, and posts sections. But a blogger template can be categorised as below :

     - Body      - Outer Wrapper      - Content Wrapper

Body

The outer most block is the Body of your template (basically everything that the computer screen covers). Background color or image and the font for your blog can be defined here.

Outer-wrapper

This container covers your whole template [the body is more like the outside part of your template]. In general, its a wrapper to place multiple smaller blocks inside. The most common blocks inside this Outer-wrapper are the Header, Content, and Footer.

Header-wrapper

This block is the top most part of your blog. But inside the Header you will have other sub-blocks too - the Header Title block, the Header Description block and others etc. So, to wrap all these sub-blocks inside one large container, the largest container in the Header section is usually a Header-wrapper that wraps everything inside.

Menu

This part is where you can add links in a horizontal block. Different types of menus with different colors can be added to your blog. This section appears just after the header.

Content-wrapper

Below the Header is the Content-wrapper - basically the most important container block of all. Immediately inside this wrapper are the Sidebar containers (1,2 or any number of sidebars) and the Main container (which contains your posts, comments, or some ads).

Main-wrapper

It is the outer most container in the Main section which goes inside the Content-wrapper. Inside this Main-wrapper are the Post block, Comment block, Date Header, and other widgets created from the Add Gadget option.

Blog Post

This block contains the important stuff - your Posts Titles, Post, Post Author, Labels, etc.

Sidebar

It is the block that contains all your widgets like About Me, Labels, Archive, Text, HTML, Adsense, etc. In a standard Blogger template, you will usually find only 1 sidebar as it is 2-column template (Main and Sidebar). But it's actually easy to add multiple number of sidebars. The most common ones are 2 sidebars in the 3-column template.

Footer

It is the bottom most container of your template. As in the Header section, you'll also need a Footer-wrapper to contain other sub-blocks in the Footer section.

One other way to see this structure is from the  hierarchical point of view . Starting from the largest container  to its sub-containers, the structure looks like this:

• Body
• Outer-wrapper
• Header-wrapper
• Blog Title
• Blog Description
• Menubar
  
• Content-wrapper
• Sidebar
• Main-wrapper
• Posts
• Comments
• Footer-wrapper
• Footer text
• Other widgets
   

Conclusion

Once you understand this basic structure, it'll be easier to start learning about the structure of the Blogger template code. Learning the code structure is not about learning HTML or CSS, but more about how the template code is organized, which is pretty much like how the container structure is organized. It's surprising that even with little knowledge on web programming, you can customize your template quite a lot just by understanding the basic structure and some CSS language.