This is easy if you follow the step by step instructions below.

Create a folder first

1. Create a folder INSIDE your Webclass folder and name it by the month and day you start this.
2. Create a folder within that folder that is called IMAGES  this is where you will keep your background image when we “capture” it.
3. When we mention “background” below,  we will be referring to the BODY tag of your CSS file.  We sent files to you called Class01.css, Class01.html and Layout.css
4. Download the files into this new folder (the first folder) that were sent to you in the email.
5. Keep your folder opened.  Hold down the CTRL key and click on all three and right click to “open with NotePad++”
6. We will be working with the Class01.css the most.

Capturing the background image

1. Go to your theme choice online.  Go to   http://wp-themes.com/adstyle (replace “adstyle” with your theme name.)
2. Right click on the theme and scroll down to Web Developer, over to Images, down to View Image Information.
3. This will give you the images and the information about each of them used in this theme.
4. Find the image you are looking for at this time.  You will want a background and maybe something for your Masthead as well.  You can also capture buttons here.  Click on the link to the image you want.
5. When it opens to that link, right click and choose “save as” and save to your “images” folder.
6. Now do the same with any of the other images you want to capture.
7. If the site is made with a gradient that is hard to use as a background image you can view the CSS and then look for the where the CSS tells you the image file for the background.  Open this page and replace “adstyle” again with your theme name to get to the CSS file.    http://wp-themes.com/wp-content/themes/adstyle/style.css
8. Now go back to the Class01.css file and find where it has the BODY element and change the background color and background image from the image you just captured and from the CSS file of your theme.  Remeber that you are not changing the CSS of the blog page but the Class01.css because this is for your Index page on your site.
9. The images you have selected will go in your CSS file under Body background image or Masthead image; whatever you want to replace.
10. You can also just change the color of the background (as mentioned above)  to meet with the image you put in the Masthead.  Just looking in the CSS file for this tag that tells you the color choice.
11. Save your file and then double click on the Class01.HTML file to see how changing the CSS file has changed the correct elements in your page.

NOTE: When you are changing CSS in any way, I suggest using the notes brackets  -  /*   */ – and copying your styles into the brackets so you will have it right in front of you what you started with, then delete them when you have decided you are happy.  So to make this clear.  Put the CSS from the theme AND the Body style info copied (not dragged but a copy of them) into the brackets so you can work them and have a saved copy of the original of each.   This way you will have a copy in case you don’t like what you do.

1. Next you are going to look for other changes that need to be made.  Maybe your Masthead is too small for the image.  The image may be 660px and your Masthead is only 630px.  You will need to look for that tag as well and change the width to suit the background.
2. It is not enough to change only the Masthead in this case but now the Navigation and Container styles will also have to be adjusted.   Hold down the CTRL key and hit F to open the find box.  You can put the 630px into it and it will find those instances in the CSS folder and then as you find them go over to the text and type the new amount; 660px (or whatever yours is).  Keep hitting the next button until you have corrected them.  Sometimes this is found in the Layout.css file instead.
3. Gotta Go….   now find the colors for the rest of the CSS that you want to change to match the navigation and Masthead color or the “a” and “a. hover” tags also.

Now we are going to match up your CSS with the CSS we just captured.

Find the tags that are the same.
We are going to replace what is in our CSS with the attributes that are in the background CSS.