Disclosure: this post may contain affiliate links, which means I may make a commission if you decide to make a purchase through one of my links, at no cost to you.
As you can probably see, I have been working on making my blog more personal with images I find online or upload myself. While this post is not about my house transformation, it IS about using your creativity to transform what you don’t like into something that is uniquely you.
My previous background was one I downloaded from Hot Bliggity Blog but I wasn’t happy that it was green. I liked how it created a work-in-progress vibe, but it just wasn’t quite right.
Over the next few months, I am sure that I will have continuing changes to the appearance of this blog to reflect the changes I’m making to the house. As such, I really wanted to be able to make the changes on my own but was really struggling with how to make it work and to get my background images to actually appear on screen.
A friend recommended that I use the Free Blogging Secrets page I found on Cutest Blog on the Block, but their instructions were still leaving me with a white background and blah look. However, my searching finally paid off with another site leading me to this blogger’s post on the correct HTML code to use. Skeptical, I tried the code expecting to still see white, but it worked! Woo hoo!
In the spirit of sharing knowledge and in case the above links don’t work for you in the future, I will repeat the instructions below based on how I did it (note: I use Blogger, so there may be different instructions for any other blog site):
1. Create a Photobucket account.
2. Using whatever software you choose, such as Photoshop, Paint, or my personal (and FREE) favorite Paint.NET, create an image size of 1700 x 1320 pixels at 72 resoltution.
3. Create your background, making sure that you use an appropriate color in the middle (light if your text is dark, dark if your text is light). Get creative!
4. Upload your image to photobucket. Make sure you choose the 1 megabyte size for uploading (this is the max for uploading with a free photobucket account).
5. Log into your blog account and select the Layout tab. If you don’t already have it, pick a new template and choose the MINIMA template.
6. Click “Edit HTML”. Scroll or CTRL+F to find the section of code that looks like this:
body {
background:$bgcolor;
margin:0; color:$textcolor; font:x-small Georgia Serif; font-size/*
*/:/**/small; font-size: /**/small; text-align: center;
7. Change it to look like this:
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;
8. Using the direct link from your photobucket image (hover your mouse over the image if you’re in your album and several links should appear), copy and paste it in the above code where it says direct link.
9. Click “Save Template.” Presto change-o, you’re done!
My new background is still too plain, but I’m definitely working on it. Now to figure out what to do to dress up my header…
