We have 215 guests online

How to Make Your OWN Background

This is my most favorite secret of all! You can use almost any photo editing program to make your own backgrounds. I use Photoshop, but since that program can be a little pricey, there's also programs like Microsoft Publisher, Microsoft PowerPoint, or a very cool program you can download for free online from a site called Paint.net (this program has many of the Photoshop features, but without the price!) I also just found out about another one called GIMP you could try.

Start with a new screen and make sure the sizes are as follows:

screenshot 1

Next, open up all of the elements that you plan to use with your background. There are lots of free digital scrapbook download website for you to find cute stuff on. One of my favorite sites is http://www.digiscrapdepot.com/ . Remember, there are very strict piracy laws when using someone elses designs. You may only use these elements on your own blog. You may not redistribute these products in ANY way.

These are the elements I will be using for my project today:

screenshot 2

Next you need to put all of the basic elements onto your background. Be sure to keep the follow measurements in mind. You need to stretch and pull to make everything look just right.


This is my basic background

screenshot 3


Please note: If you are creating a 3 column background, you will want to make the center at least 9 inches (or more) wide.

Next you‚ add any fun elements to your project. Make sure everything is placed so that you will be able to see it on your monitor once the background is applied. Ribbon is always a fun addition to any background.

Below is my background with the elements added:

screenshot 4

Next you get to have fun! Play around with the colors, shadowing, sizes of everything. Decide which elements you want to POP and add a glow or shadow around them. Just be creative!

This is my completed background:

screenshot 5


You must have an account with www.photobucket.com or Flickr to do this next part. Log in to your account and go to your image gallery. You'll see the following box, where you will upload your background, but first and this is so important, you MUST change the reduce to‚ area to say 1 megabyte! This will make sure that your background will stretch the entire length of your screen.

UPDATE: if you save your background as a 1 megabyte, and you find that it is STILL TOO SMALL, try uploading it as a 2 megabyte. It will fit much better.

UPDATE #2: compliments of Heidi Fowler, who suggested this, you can also save the file at a lower resolution or file size, this will make it so that the image is not as high resolution and you can use it! Thanks Heidi!

UPDATE #3: If your background is still showing up too small, you'll need to upgrade your photobucket account (This is not free) to a premier account. That way you can upload any file, any size, any time you want and it will always fit on your blog. :)

Screenshot 6

Once your background uploads, you'll need to find the direct link and use this in the next steps:

screenshot 7

NOW you'll need to follow these specific instructions as to how to apply it to your blog:

 

1.  Log onto your blog.
2.  Click on your 'Design' tab or 'Layout' tab.
3.  Click 'Add a Gadget'.
4.  Click on the (+) sign next to 'HTML/JavaScript'.

Copy and paste the following code into the box:

 <script>document.write(unescape("%3Cstyle%20type%3D%22text/css%22%3E%0Abody%20%7B%20background-image%20%3A%20url%28%INSERT LINK HERE%20%22%29%3B%20background-position%3A%20center%3B%20background-repeat%3A%20no-repeat%3B%20%20background-attachment%20%3A%20fixed%3B%20%7D%0A%3C/style%3E%0A%3Cscript%20type%3D%22text/javascript%22%3E%0Avar%20div%20%3D%20document.createElement%28%27div%27%29%3B%0Adiv.setAttribute%28%27style%27%2C%22position%3A%20absolute%3B%20left%3A%200px%3B%20top%3A%2030px%3B%20z-index%3A%2050%3B%20width%3A%20150px%3B%20height%3A%2045px%3B%22%29%3B%0Adiv.innerHTML%20%3D%20%27%3Ca%20target%3D%22_blank%22%20href%3D%22%20http%3A//wwww.thecutestblogontheblock.com%22%3E%3Cimg%20border%3D%220%22%20src%3D%%22%3E%3C/a%3E%27%3B%0Adocument.getElementsByTagName%28%27body%27%29.item%280%29.appendChild%28div%29%3B%0A%3C/script%3E"));</script>


5.  Replace the 'direct link' of the image with the words that say 'INSERT LINK HERE'

6.  Click 'Save' and you now have a new HOT blog!