Customise your Blog Background in HTML

Want to keep your older style blog template, but think it's looking ready for a bit of a revamp? Well, this post is going to cover how you can make some simple changes to your blog HTML to change the appearance of your blog background. I'll show you how to add in a link to an image or pattern, or how to select a custom colour to match the palette you've used on your blog.
(**If you're looking for my post on Customising Your Blog Background on Layout Templates, you'll find it here.)

If you're using an older blog template, then it can be really useful to know how to customise your blog background in HTML.  If you're not confident with using HTML, this can seem a little more challenging than if you're using the Template Designer option, but it is pretty straight forward once you get the hang of it.

To change your HTML, you need to firstly go to your 'Design' tab and click 'Edit HTML'.

The very first thing you should always do is save a copy of your template, so that you have a backup if anything goes wrong.

After you save that, type CTRL F, and type in body to find the section of your template that looks something like this:

Once you're there, you can now make changes by either selecting a custom colour, or by adding in a background image.

Adding custom colour to older style blog templates
This is super easy once you've reached this stage. Simply take the hex code that you want to use from your palette and enter the details here like this:

** Some templates will let you leave the wording as just background, others will not accept the change unless you change this to 'background-color'.

Select 'preview' to check the appearance of your template and if you're happy with the background colour click save.

***Tweaking the post/sidebar background area***
A common problem that can arise when you change the colour or add a pattern or picture background is that it makes the post hard to read if it shows through. To stop that happening, find the following section of code and change the color to prevent that happening (in this case I've changed it to white).

Adding a photo or pattern background to your blogger template
The first thing you need to do is upload the photo or pattern that you wish to use to an image hosting site. For this I've used Photobucket.

Once I've done this, I need to look for the same section of HTML code that you change to add a custom colour, which looks like this:

To change the background colour to an image, type 'URL', then copy and paste the URL of the image you uploaded in brackets next to it. It will now look like this:

Preview your blog and if necessary tweak the post/sidebar background (as above) and once you're happy with the changes you're done!

You now have a unique colour or pattern that will really make your blog stand out.

If you have any questions, please let me know!