Learning How to Make a Blogger Template
In order to create your own Blogger template, you'll need to understand the basics of CSS (Cascading Style Sheets). This is because the Blogger template is built upon CSS formatting, so the only way you can correctly position text, pictures and other elements of your template is by understanding and using correct CSS formatting.
The simplest way to create your own template is by not starting from scratch, but instead downloading any one of the many free templates that exist throughout the Internet and then customizing it to make it your own. Elements of the Blogger template you'll want to customize:
- Body background image (look for "body")
- Center background image (look for "#center")
- Header image (look for "#header") - also set height and width
- Footer image (look for "#footer") - also set height and width
- Outer wrapper ("#outer-wrapper") - this is the width of your blog
- Main ("#main") - set the width of the section for posts
- Sidebar ("#sidebar") - set the width of the right and left sidebars
By finding each of these elements within an existing template and tweaking them to suit your needs, it will be easy to create your own template in no time.
Other Elements of a Blogger Template
Even after you've customized the major parts of your Blogger template that are listed above, there are still a large number of CSS elements that you can tweak in order to further customize it and make your own template.
- Body - The CSS body keyword allows you to change the body margin space and padding, background color, overall body font size and other elements of the overall body of the blog.
- H1, H2, etc... - These are the various headers that you'll be using throughout your blog. In these sections of the template, you define the margin, padding, color and font size of each header type.
- P, OL, UL and BLOCKQUOTE - For each of these elements, you can define the height of each line, margins, padding and list style (for lists).
- A - Define the color and other characteristics of links on your blog.
- IMG - Define characteristics of embedded images and image links.
- The power of CSS within the XML Blogger templates is that you can define all of the formatting and structure of your blog within this one file using CSS code. This is why you never have to worry about formatting when you're writing blog posts, because all of the formatting work is already done through your template.
Different Formatting for Different Blog Sections
In addition to the elements listed above, when you scroll down in your base template, you may also find that the elements above are repeated. This is because different sections of your blog may have different formatting settings.
For example, you may find sections labeled "#menu", "#posted", "#content" or anything else which defines a particular section of the blog that needs formatting information. This allows you to set different fonts, headers, margins and other settings for sections such as the your menu, post entries, sidebars and other blog elements.
Additional Considerations
When you're learning how to make a Blogger template, you may be tempted to add content to your template. However, it's important to remember that a template isn't a place for static content (such as the title of your blog). That information all exists within the page elements that you set within your Blogger account. When you download a free Blogger template to use as your base starting point, all of those values are automatically loaded in through scripting, so resist the urge to enter static text or blog content directly into the template.
Remember - the template is only for formatting your blog, not for adding content! There are a few cases where you'll be asked to insert code directly into your template, such as for Google Adsense, but most of the time you'll add widgets and gadgets to your blog through the Blogger graphical interface once you have your base template working.
Most importantly, even if you've never written a line of code in your life, anyone can learn how to modify an existing template, and by doing so you'll eventually learn what the CSS and XML codes mean and how they affect the look of your blog.
