How to Make a Layout for Blogger HTML

Make a layout for Blogger using HTML code on a cascading style sheet (CSS) document. Although Blogger doesn't allow you to alter the fundamental structure of any page on a Blogger blog, such as adding or removing features on a page, it is possible to fully customize the look of a Blogger blog.

Instructions

1. Log in to Blogger with your Google username and password. Choose the "Design" button under the name of the blog for which you wish to code a layout.

2. Click "Edit HTML," then right-click within the field containing text and click "Select All." Right-click again and choose "Copy." Select "NotePad" from the Windows "Start" menu, then right-click within the blank text document and choose "Paste."

3. Use the CSS document that already exists, and that you've just pasted into a blank text document, as a guideline for your layout. Edit values within any section of the document to change the look of your blog. For example, edit the appearance of the body of the blog by finding a section of code that looks like this:

   body {
   background:#FFF;
   margin:0;
   color:#000;
   font:x-small Georgia Serif;
   font-size/* */:/**/small;
   font-size: /**/small;
   text-align: center;
   }

   Changing the "hex codes" behind the "background:" and "font:" elements, for instance, alters the colors of the site's background and text.

4. Right-click within the "Edit HTML" field, then select "Select All." Right-click again and choose "Paste" to replace the existing layout with the new one. Click "Preview" to make sure it appears to your liking, then select "Save Template."

References

• Blogger Help: Layout Guide