How To Install This Template

Step 1:  Login to your Blogger blog.

Step 2:  Click > Layout > Edit HTML

Step 3:  Don't forget to backup your current template just in case!  Click "Download Full Template" and save it to your computer. 

Step 4:  Highlight your entire code and delete it, so your template is blank.  Then open this document.  Sassy Scribbler. 

Step 5:  Copy all the code paste into your template.  Preview and save!

This template is equipped with most of the widgets you have on your blog.  You can delete the extra widgets after installation by clicking "Edit" then "Remove" on each gadget.  Or you can follow the tutorial on how to keep all your widgets when transferring templates.

That's it!  Your layout is installed!  Here are some tips to make your layout look even better!

Changing Fonts and Colors
Your layout has completely customizable fonts and borders.  Just go to "Layout" then "Fonts and Colors" and pick and choose your faves!  Download the "Instant Eyedropper Tool" to match your font and border colors to the layout. (They are already coordinated for you, but you may want to change it up a bit.) 

For "Color Change" layouts, you can select your own background color by changing the "Page Background Color" value. 

Custom Fonts
Use this awesome tutorial from Kevin and Amanda to change your post title and sidebar fonts to a CUSTOM font!  Don't forget to take the extra step to change BOTH sidebar title fonts.

Positioning Page Title and Description
Depending on the number of characters in your page title and blog description, they may be slightly off center.  You can easily change this by adjusting the SIZE of your page title font and description font in the "Fonts and Colors" section of your blog editor.

Advanced:  If you would like to adjust the blog title and description position, follow these instructions.

Blog Title Position
Go to "Edit HTML" and scroll to where you see this section of code.

#header h1 {
margin:5px 5px 0;
padding: 50px 0px .75em 500px;
line-height:1.2em;
text-transform:none;
letter-spacing:.2em;
font: $pagetitlefont;

Top:  Will adjust the distance between your blog title and the top of the page.
Right:  Will adjust the distance between your blog title and the right hand side of the page.
Bottom:  Will adjust the distance between your blog description and blog title.
Left: Will adjust the distance between your blog title and the left hand side of the page.

Description Position
Go to "Edit HTML" and scroll to where you see this section of code.

#header .description {
margin:0 0px 0px;
padding: 50px 0px 0px 500px;
max-width: 400px;
text-transform:none;
letter-spacing:.2em;
line-height: 1.4em;
font: $descriptionfont;
color: $descriptioncolor;
}

Top: Will adjust the distance between your description and blog title.
Right: Will adjust the distance between your description and the right hand side of the page.
Bottom: Will adjust the distance between your blog description and main area.
Left: Will adjust the distance between your blog description and the left hand side of the page.
Width:  Fewer pixels will make your description narrower and fit into a smaller space.  More pixels will make your description wider.

Due to the nature of color-change layouts, your main posting area and sidebars may not be of equal height.