Main Page Beginners Design Tips Get Traffic Earn Money Picks Codes

Are you a Successful Blogger?

Successful Blogging

  • Beginners can learn the basics about Blogging
  • Advanced Bloggers can learn how to take their blog up a notch.
  • Anyone can learn HOW TO GET MORE TRAFFIC
  • And more- Templates, Codes, and Tips etc.

What do you want to read about? Scroll down or check out our sidebar for topics.

We post at least daily so check back or subscribe to our newsletter.

Successful Blogging.com

Adding images as backgrounds in Blogger

 Adding an image to your blog so that it appears on every page of your site, can add a nice touch. There are several ways to do this.

The easiest way of course, is to upload the picture into a picture gadget in your layouts.

However, why not put the picture somewhere unique?

To experiment with any these methods, follow these steps.
You will need to go to your html section of your blogger editor. Naturally, you should download your current template in case you do not like the new look.

To set the picture to appear in the body, or the entire screen. You will need to have your image posted on a server such as Picasa. Find the address of the image.


Look for the body section of your  code.



body

AND THEN ADD THIS{
background-image: url(URL address of your image that is hosted elsewhere);

Want your sidebar to host a background image?
look for the sidebar code that looks something like this.

#sidebar1 {
margin: 0px 10px 15px 10px;
padding:10 10 10 10;
width: 250px;
ADD THIS
background: URL(http://URL address of your image
}

Add your image to the post section

Look for this
#main-wrapper
ADD THIS  {
background-image: url(URL address of your image);

  The location of the starting image will be on the left-most side, and at the top-most position. The general command for embedding a background image is:


By default, the image will be repeated to fill up the entire background of the section.If you  choose not to have the image repeated. If that is the case, you can insert this code:-

background-repeat: no-repeat;





Bookmark and Share
10% off plus free Shipping at eBags.com

0 comments: