Drupal Site Background Image Addition

By Lynn Beighley and Seamus Bellamy from Drupal For Dummies, 2nd Edition

You can add a background image to the Left and Right Sidebars of your Drupal site to spruce them up. For example, say you still want the text on top, but instead of gray, you want faint, diagonal pinstripes.

Follow these steps:

Use FTP or your ISP's file manager to copy your background image to your web server. Put it in your theme's directory.

This example will use a background image called stripes.gif. It was uploaded to the Drupal site under themes/drupalfordummies.
Open a copy of style.css in a text editor.

Locate a section of code that deals with the sidebars, such as:

#sidebar-first, #sidebar-second {
  width: 16em;
  padding: 1em;
  margin-right: -18em; /* LTR */
  background-color: #ddd;
}

Add the following line inside the curly brackets:
```
background-image:url('stripes.gif');
```
Save and upload your file.

Now when you look at the site, the stripes show up on the sidebars.

Unfortunately, the bottom parts of the sidebars don't have the background. Only the portions of the sidebars with actual content blocks are filled in. You need one more line of code. Coming right up.
In the body section of style.css, add the same line of code:
```
background-image:url('stripes.gif');
```
Save and upload your file.

Your background is now visible all the way to the bottom of the page.