Friday, April 25, 2008

Instructions on how to change your background to an Imagine That background

This is much easier than it first looks!


  1. If you haven't already, switch your template to Minima (from the home page of your blog, click "customize, pick new template" {under the layout tab}, and then select minima. Then click "save"). You MUST switch your template to Minima for this to work.
  2. Now we're ready to edit some html. From the home page of your blog, click "customize" in the upper right hand corner of your screen.
  3. Click "edit HTML".
  4. At this point you'll want to download your current template to be on the safe side. Just click "download full template".
  5. Scroll down to the point in the code where the "body" section is (arrow 2). To see how far you will have to scroll, take a look at the scroll bar (arrow 1). Once you've made all the changes (when you are done with #6), don't forget to click "save template" (arrow 3).
  6. Delete the text you see below in pink and replace it with the text you see in blue. So, delete this: body {background:$bgcolor;margin:0; color:$textcolor; font:x-small Georgia Serif; font-size/* */:/**/small; font-size: /**/small; text-align: center; and replace it with this: (all of the text in blue) body {background:$bgcolor;background-image:url('/direct link');background-position: center; background-repeat:no-repeat; background-attachment: fixed;margin:0; color:$textcolor; font:x-small Georgia Serif; font-size/* */:/**/small; font-size: /**/small; text-align: center;
  7. Now erase this: '/directlink' and then replace it with the code for the background you want. The code is all of the text after the word "code:" (do not include the colon with the code) you see below the background. So if you want this pink background that you see directly above, this is what your code would look like: body {background:$bgcolor;background-image:url(code:http://i41.photobucket.com/albums/e263/Gracies_Photos/finished%20backgrounds/greenpeach.jpg);background-position: center; background-repeat:no-repeat; background-attachment: fixed;margin:0; color:$textcolor; font:x-small Georgia Serif; font-size/* */:/**/small; font-size: /**/small; text-align: center;
  8. And this is what it all would like in context:

Again, make sure you click "save template".

(pre-dt)



NOTE: If your screen is set to larger than 1280 x 800 and one of the backgrounds doesn't fit (there's white lines above & below, or even to the left & right of the background), just email me & I'll send you code for one that will fit. No charge.

No comments:

Post a Comment

Want to know the best way to look for a job? Check out http://jobhuntingwarrior.blogspot.com/

Feel free to add your pic, a pet's pic...whatever makes you happy!

Looking for the FREE ZONE (free blog background sites, free font sites...)

That information has been moved to the Imagine That Plus site so that this site will load faster (that one doesn't have as much, and everything is pretty much in posts & not at the bottom of every page so it loads at a pretty good rate).
  • Click HERE to go to the free fonts list
  • Click HERE to go to the list of Creative Memories consultants
  • Click HERE for the list of places that have free blog backgrounds
  • HERE is a list of very helpful Cricut links, including the ones above