oh, you all want to customize your blogs too?

Got a few requests for a tutorial...so here's my best directions for how to customize your blog backgrounds...



First of all, you need to determine the size of your screen, I personally designed mine to be at full screen size, and I haven't checked to see if it's all messed up and wonky on standard computer monitors or not, suppose I should have done that.



Anyway, if you dont have photoshop or photo editing software, you can still make a neat blog background. With photoshop just create a canvas the size of your monitor and choose patterns that will look fairly seemless when repeated vertically. Here's what mine looked like originally:





Like I said, I sized mine to be the wider screen format (1280x800 pixels). I didn't measure anything for the side borders, I just kinda eyeballed it and figured I'd probably have to tweak it a bit before it would work. Luckily I didn't really have to do anything to it.



After you have it designed and saved as a jpg file, you need to upload it to a file sharing site, blogger wont host files unless they are in sidebars or blog posts. I uploaded to flickr. After you have your file uploaded, you need to look up the properties and copy the image url (it'll look like a web address, but will end in a .jpg ) Just a note though, if you use flickr, make sure you copy the url to the largest possible size you can, if you grab the url for a small picture it wont fill your screen!



You can use any desktop/wallpaper you find online for this too by the way, just make sure it will look okay repeated when you scroll the blog up and down.

This is where it gets fun. Okay, in your blogger dashboard, make sure have the layout you "sorta like" set as your blog layout. (Click on the "pick new template" link) Mine is the minima. If you try to upload your background and then change the layout in blogger you'll lose the background and have to start all over.



So - layout first, then from the "Layout" tab, you'll see a list of links across the top, click on "edit html", where at the top is a link to download full template, if you are at all nervous about changing your blog then absolutely download that template!! That is essentially your back up copy of your blog, just save it to your desktop until you are done tweaking, once you are done tweaking you can delete that file.



Now in that code box you are now seeing, scroll down a bit, just below all the code tags that say "variable" you'll see: "body { " followed immidiately by "background:" with the code for the color your blog is currently at. Delete the color code only, it's the garbled mess that may or may not look like "$bgcolor" or something similar, anyway, delete that only, leaving the "background:" and the ";" after it. Now paste the url for your uploaded jpg exactly where you deleted the color from. This is the ONLY change you need to make in the code if you want your image to scroll with the blog content like mine does. I haven't figured out how to get it to stay fixed on the screen while the blog content scrolls, I'm trying to figure it out still.



You can preview your blog from the edit html screen, so do that as soon as you paste in the url to make sure you like it! And if you absolutely mess up, then open up that backup file you downloaded, and copy and paste the original code back into the edit field and start over.



Now, this is of course the absolute basic tweaking explained in my own dumbed down language as much as possible. Let me know if it works for ya!