Guide

How to Add a Free Blog Background to your Blog using any of the Template Designer “Simple” Themes

I have noticed that there are a lot of people out there still using the Minima theme for their blog, simply because the free blog background codes don’t work well with the new Template Designer Themes. I will be working on tutorials for all the different themes. In this first tutorial, I will show you how to add a background to all 7 of the “Simple” Themes.

Step #1: Select the Simple Theme that you would like to use.

Step #2: Find a Free Blog Background that you like and copy the code (right click > Copy, or ctrl + C on your keyboard). I picked a background from Shabby Blogs.

Step #3: Go to your Blogger Dashboard and click on “Add a Gadget” (it doesn’t matter where, I just usually pick one of the bottom ones).

Step #4: Select the “HTML/JavaScript” Gadget.

Step #5: Paste (right click > Paste or ctrl V on your keyboard) the free background code in the text area and click on Save.

This is what it will look like now:

Step#6: Go to your Template Designer and click on the Advanced tab, and then the Backgrounds tab. No change your Outer Background, Main Background, and Header Background to Transparent.

Step #7: Go to your Adjust Widths tab, and change the width size to fit within your new blog background.

If you are using the Blue, Orange, Grey, or White version of the Simple Template, then you are finished here, if you are using the other versions (that use images), continue on to the next steps.

If you are using one of the other themes, you blog might look something like this.

Step #8: Go to your Background Tab and click on “Remove image“

You can either stop at this point, or if you still have a header image, like below, then move on to the next step.

To get rid of that gradient image, add this code to your Advanced > Add CSS :

Finally, if you have a line going through the width of the page, underneath the Header/Menu Bar (the green Simple template does that). Then go to the Advanced Tab, and Accents, and change the “Separator Line Color” to Transparent.

There you have it, you can use any of the simple themes with a Free Blog Background!

Beginning HTML Crash Course!

Use this crash course in HTML to style your posts and sidebars like a pro!

Quick Reference Guide:

Text Styles
Text Size
Text Color
Text Alignment
Text Format Combination

Images – The Basics
Image Borders
Image Size

The Basics:

What is HTML?

HTML stands for “Hypertext Markup Language.” It is the hidden “instructions” that tell your web browser (such as Internet Explorer and Firefox) what to display on a page. HTML is made up of a series of commands. Each command is known as a “tag,” which start and end with an angle bracket. a tag can also end your command, using a slash. The command from beginning to end would look something like this:

<command>element here</command>

Now that you have learned about tags, the basic building block of HTML, all that is left to learn are the different types of commands and how you can apply them to elements on your page.

Text Formatting:

You no longer have to be limited to plain, boring text in your posts! In this section, I will show you how to change the size and color of your text, and much more. Just keep in mind, a little goes a long way!

Text Styles

Below are different text style tags and a preview of what they do:

Bold Text: text here – text here

Italic Text: text here – text here

Underline Text: text here – text here

Strikethrough Text: <del>text here</del> – ~~text here~~

Text Size:

Small: text here – text here

Medium: text here – text here

Large: text here – text here

X-Large: text here – text here

Text Color: