Sharing... is caring...

I have been playing more! I've had much fun... I created a blog background for Tina, but it was too purple for either of us. Here it is if you want to use it!

It's set for a 3 column width blog, using a minima template.

Header

Here's how to add a Header to Blogger:

1. Click on the pic to make it large.
2. Save the pic to your computer.
3. Go to your blog and click "Customise"
4. Click "edit Header".
5. Upload the image from your computer.
6. For placement, choose only "Behind title and description"
7. Save.

If you have editing software you can add your title to your pic, then save. In that case choose "Instead of Title and Description" when adding the Header.

Background

This is how you add the background to Blogger:

Copy the code posted below your chosen background.

1. Make sure you are logged in and then click "Customise" at the top of your blog.
2. Click on "Add A Gadget"
3. Scroll down the box and click on "Html/Javascript"
4. In the "Content Box" paste the Html code you copied.
5. Click "Save" and your done!

<style type="text/css">
body {background-image: url("http://i11.photobucket.com/albums/a182/MissyMoo_20/General%20Pics/Tina-1.jpg"); background-position: center; background-repeat: no-repeat; background-attachment: fixed; }
</style>

{Thanks Duncan for the coding help, got me in the right direction}

Ok... so this is hosted at my Photobucket account, if you prefer to add to your own, save it and then get the html code and replace the URL html code above between the " and the " where it starts http: with your own pic link.

Don't forget to go to the "Fonts and Colours" tab as well to change things so that they match your new colours.


OK... this design is also set for my blog, which I have made the columns a little wider than the usual minima template. Here's how to change that:

Before you make any alterations ALWAYS save a backup copy to your hard drive. You can do this by selecting the “Layout” option in Blogger, then the “Edit HTML” option, then “Download Full Template.”

Select first Blogger "Layout" option and then "Edit HTML."

1. Scroll down until you find #header-wrapper, change the width show with red (660 to 910):


#header-wrapper {
width:910px;
margin:0 auto 10px;
border:0px solid $bordercolor;
}

2. Scroll down until you find /* Outer-Wrapper, and you will find this following code, where you should make the changes shown with red:

#outer-wrapper {
width: 900px;
margin:0 auto;
padding:10px;
text-align:$startSide;
font: $bodyfont;
}

#main-wrapper {
width: 600px;
float: $startSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

#sidebar-wrapper {
width: 226px;
float: $endSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

OK... so anyways, that's a crash course on doing your own stuff, I'm very new at this so I hope that's all clear and correct - just remember to SAVE everything before you change things!

For more "How To" help... pop over to Cute n Cool Blog Stuff here, she has all the explanations and has helped me understand how this all works a little clearer! She also has some fantabulous backgrounds you can use!

Take care of you.