Adding a House of 3 Blog Couture Background to Blogspot.
1. Download your House of 3 Blog Couture Background of choice. Here, I’m showing the Vintage Ledger design.
2. You’ll need to host this on Photobucket. So, create an account, if you don’t already have one, & go to your Image Gallery.
**Notice the above red star: Make sure the ‘Reduce to’ says ‘1 megabyte file size’. In order for your background to span your screen width, this MUST be selected. (IF you have problems with the size of your 1MB background, you may want to try uploading it as a 2MB background. It may help in the screen viewing.)
3. Click: Choose Files & upload your House of 3 Blog Couture Background.
When your background is loaded, it will appear as an image in your account.
Click on the box & copy the Direct Link.
4. Now, you’ll apply this to your blog, so log into your blog.
5. Go to: CUSTOMIZE>LAYOUT>PICK A NEW TEMPLATE & choose a ‘Minima Template’.
6. Go to: EDIT HTML. Inside your box, you’ll see a bunch of HTML code.
so…..Scroll down just a bit until you see body {
Below, you can see what it will look like with no background code.
7. Now you will paste the Direct Link from your Photobucket Image Gallery into the blue highlighted area. **Note the parentheses.
You’ll replace the HTML code highlighted as-
background-image:url(DIRECT LINK FROM PHOTOBUCKET)
;background-position: center; background-repeat:no-repeat; background-attachment: fixed;
as shown here highlighted in blue.
8. Click Save Template & view your House of 3 Blog Couture Background on your blog to make sure it’s correct. If you have any problems, just go back into your HTML code & make sure it’s got the link, etc.
Have fun changing up your Blog Couture!
**note: Each monitor & browser does different things to everyone’s *view*.
The backgrounds have been designed with this in mind.
So, each background has some designs on the edges *for those monitors * that show MORE of the background*
but, also has designs closer to the middle for those that don’t show all of it.
***You may or may not be able to see the entire background. (unless you fiddle with the HTML code, but I suppose that’s why you pay $$ for custom blog wear! 
Please keep this in mind as you work with your Blog Background…and be sure to choose/purchase one that will accommodate your blog.
February 1st, 2009 at 4:36 am
Thank you so much for saving me from blog boredom! At last a reasonably priced resource for eye candy!
February 1st, 2009 at 6:27 am
Hi there
I love the blog backgrounds!!!!
but I have noticed some differences on your blogs
Rhonna’s background is fixed, but Heidi’s background mooves with the scrolling?
can you please explain how to get the beackground mooving?
thank you so much, Eva Blokker
February 1st, 2009 at 6:45 am
Great tip! Thanks for this. Very excited for the three of you. Love the site.
February 1st, 2009 at 8:20 am
Is there a way to do this with typepad or other blogging software? I noticed that Heidi and Janet both have typepad accounts and use the blog couture.
February 1st, 2009 at 10:00 am
Is it possible to not have to upload the background to photobucket? They don’t run enough bandwidth and within a certain amount of time, your images go away until the next month.
February 1st, 2009 at 4:14 pm
Setting your background as fixed or scrolling is very easy. You will want to use the following code examples in your CSS (as mentioned in the tutorial) respectively:
SCROLLING or REPEATING:
background-image:url(DIRECT LINK FROM PHOTOBUCKET)
;background-position: center; background-repeat:repeat;
FIXED:
background-image:url(DIRECT LINK FROM PHOTOBUCKET)
;background-position: center; background-repeat:no-repeat; background-attachment: fixed;
February 1st, 2009 at 4:15 pm
Tanya - You can upload your image anywhere you want (for example, you can upload it in typepad, on a hosting account, or search out free hosting accounts that will let you host images.) All you need to do is have the full URL to the image for your CSS code so that your blog can find the image.
February 1st, 2009 at 4:20 pm
Christy - You can use the example code for almost any blogging platform. Just look for a place to add or edit custom CSS code unless your admin panel has a place to upload custom background images.
If you still have questions, just post what type of blog you have and we’ll help you out!
February 1st, 2009 at 6:50 pm
for anyone wondering how to add a background with typepad you need a pro, premium or business account to customize your background.
February 2nd, 2009 at 9:18 am
Thanks for the help! I got it uploaded but it’s really skinny so it is throwing the rest of the blog off. (Everything is in the middle pannel and not spread out to the edges of the page) I’ll have to take a look and see if I can open the margins up - I was just using a basic Blogger template like you mentioned. Or did I do it wrong?
February 2nd, 2009 at 2:36 pm
I just uploaded mine and I love it! My only problem is that I uploaded it to photobucket at 1mb and it doesn’t fit the screen. Directions say to upload it at 2mb but Photobucket doesn’t give me that option. Did I miss something?
February 2nd, 2009 at 2:49 pm
Oh and the center bog text is not fixed. It scrolls on the page, but the background does not.
February 2nd, 2009 at 4:21 pm
I would love it if there were directions for using the backgrounds and banner in typepad. It appears to be quite a bit different,( I am not much of a techie… sorry) I have printed out typepad’s help sheets but they aren’t real helpful when it comes to the css code and I don’t know if I need to alter my blogs configuration either. thanks in advance
tena
ps love all the stuff you have at your site!
February 2nd, 2009 at 6:21 pm
this is so exciting I just found this site
one question are the templates made for 3 columns or only for 2?
many thanks,
Miriam
February 2nd, 2009 at 8:02 pm
I’m with Tena, sure would love to know how to use the backgrounds in typepad!
February 2nd, 2009 at 8:41 pm
I am having a problem even getting the photo into my photobucket account. It wont accept the url when I paste it in since I can’t seem to find a place to save it to my computer. Any tips? I just get an error message in photobucket when I try to save it using the url.
February 2nd, 2009 at 9:13 pm
So far I’ve uploaded the blog header but still trying to get the background to jive with all my photos. Love the art though and Stewart, thanks for jumping on my issue with the downloads earlier today! I like that the text rolls and the background stays put, that is cool for me
February 2nd, 2009 at 9:15 pm
I’ve uploaded it and it looks great - thank you
February 3rd, 2009 at 4:46 am
The Scrolling or Repeating tip didn’t work for me - it’s still fixed. Also, does anyone else have the problem of the background appearing too large - I feel like I’ve lost a bulk of the background.
Thanks!
February 3rd, 2009 at 8:42 am
I loaded everything according to directions, but I have the template that has the lined “notebook” look in the middle. When I use it as my layout, my text and everything is off center - it’s over to the left, so it doesn’t line up with the “notebook” on the template. HELP!
February 3rd, 2009 at 9:13 am
TIP: If your background seems to wide or too narrow you can go into your blog settings (typepad or blogger) and adjust the main and side columns widths. Experiment making them wider or narrower based on your needs.
Here is some sample CSS code to help you get things squared away:
IF YOU WANT IT TO REPEAT VERTICALLY AND HORIZONTALLY PASTE THIS:
body {
background: url(http://example.typepad.com/background.jpg) repeat top center;
}
IF YOU WANT IT TO BE FIXED PASTE THIS:
body {
background: url(http://example.typepad.com/background.jpg) fixed top center;
}
(of course remember to replace the example link with your own.)
LASTLY, when uploading in Photobucket if you choose a smaller file size option there is a chance the background will be sized down and will not look correct. Try to upload the image as is. Good Luck!
February 3rd, 2009 at 10:25 am
can you please give directions on how to do this on typepad
thanks
February 3rd, 2009 at 12:57 pm
There are so many places in the Edit HTML field that displays numbers (when trying to adjust main and width columns)…anyone know exactly where to go to adjust these as mine appears too large. Thanks!
February 3rd, 2009 at 9:34 pm
Still trying to get this blog couture up… i am getting stuck at the copy the direct link in photobucket. I do this (or at least I think I have) then when I go to my blog (after I have changed my template to minima) and try to paste but nothing happens. Sorry for the trouble…can any one give me a hand!
Karen
February 4th, 2009 at 10:33 am
Karen, this same thing happened to me. I looked closer & I had a space in there where I shouldn’t. As soon as I fixed that, it worked.
Ashley Beth, look at ‘header’ ‘outer wrapper’ & ‘footer’ & check the numbers there…see if those are the ones you’re looking for?
Elisabeth, Stewart put up a Typepad helper…did you see that?
We are here to help! Just let us know if you’re still having problems!
R
February 4th, 2009 at 11:12 am
Hi Rhonna,
I feel like the biggest pain out there, but… I tried your solution and no luck! I still can’t seem to get it to work. My header is great and I am really anxious to get the back ground working. Help if you can Please!!!
Karen
February 4th, 2009 at 11:56 am
LOL…No way, Karen…you are NOT a pain. We want this to work for everyone!
Ok, email me
rhonna@houseof3.com
& can you take a screen shot of what you see?
then, maybe I can help!
LOL…i guess maybe I can try to squeeze through the computer to come & help you…we wish, huh?
k…ttys!
R
February 4th, 2009 at 2:37 pm
Ok desperation seeking assistance. Not sure if seeing this part can help, but I copied what was in my html
body {
background:$bgcolor;background-image:url(http://i147.photobucket.com/albums/r287/andi313/Houseof3_RFPeacock.jpg)
;background-position: center; background-repeat:no-repeat; background-attachment: fixed;
margin:0;
Can you see what I may have done wrong?
February 4th, 2009 at 3:22 pm
Woooo hoooo I figured it out. It looks great, now I have to decide if I want to buy other ones. I love the vintage ones too. I like a couple of the links I’ve seen they are sooooo adorable!! Sorry for being a pest.
And I am soooo loving House of 3!!
February 4th, 2009 at 4:28 pm
Andrea!!! Yea for you!!!
You’re not a pest! soo glad you got it.
So, what was the problem? Maybe your experience can help out others! *wink*
R
February 4th, 2009 at 9:49 pm
I am going to use wordpress for my blog…would these instructions still apply?
February 5th, 2009 at 8:35 am
Hi Rhonna - I see where the Header, Outer Wrapper, and Footer sections are; however, I have no idea what to change them to…there is so much beneath each one…any idea what the numbers should be OR which numbers I am supposed to be messing with? For example, this is everything that is below Header. (sorry this is lengthy!) Thanks for your help!
#header-wrapper {
width:660px;
margin:0 auto 10px;
border:1px solid $bordercolor;
}
#header-inner {
background-position: center;
margin-left: auto;
margin-right: auto;
}
#header {
margin: 5px;
border: 1px solid $bordercolor;
text-align: center;
color:$pagetitlecolor;
}
#header h1 {
margin:5px 5px 0;
padding:15px 20px .25em;
line-height:1.2em;
text-transform:uppercase;
letter-spacing:.2em;
font: $pagetitlefont;
}
#header a {
color:$pagetitlecolor;
text-decoration:none;
}
#header a:hover {
color:$pagetitlecolor;
}
#header .description {
margin:0 5px 5px;
padding:0 20px 15px;
max-width:700px;
text-transform:uppercase;
letter-spacing:.2em;
line-height: 1.4em;
font: $descriptionfont;
color: $descriptioncolor;
}
#header img {
margin-$startSide: auto;
margin-$endSide: auto;
}
February 5th, 2009 at 11:31 am
Hey there! I’ve been tooling around too, and am having problems! I have tried using the layout Minima, I’ve tried adjusting my HTML (how my husband does this for a living, I’ll never know- I’ll go blind!!)..
Can you help me move my type margins over? I just can’t figure this out! TIA!!
Anne
February 5th, 2009 at 4:59 pm
The problem for me all was the download, once I changed it to 1 megabyte it fixed everything!
February 7th, 2009 at 3:37 pm
Ok, I am really stuck. My first question, can I do this on a Mac? Second question, where the heck do I find the http link? Photobucket? If I could just locate that I think I’d be ok.
Thanks so much,
Kristy
February 7th, 2009 at 10:16 pm
OMG — I DID IT ! I am sooooooo NOT technical and I was able to download a background and customize it on my blog. It looks fantastic !
My word of advice would be when you go to paste the HTML in the spot where the directions indicate, make sure you PUT IN THE PARENTHESIS around BOTH ends….I didn’t add one on the end and made it not work but once I added the last one it worked like a CHARM!
I am a HUGE fan of this site and can’t wait for the other products to be ready for us to see and purchase ! Plus with directions like those in your tutorial, maybe I will be more willing to learn to do hybrid scrapping too
Best of Luck HEIDI, RHONNA and JANET on your new venture…so wonderul!
February 9th, 2009 at 9:21 pm
I thought I had it. I downloaded at 1 megabyte and it is still too small for the page. Thanks for any help.
P.S.
LOVE the new site!!!
February 9th, 2009 at 9:43 pm
Alright,
I upgraded to the larger size and volia!
February 9th, 2009 at 9:45 pm
Alright, I upgraded to 2 megabyte and that did it.
February 11th, 2009 at 12:41 pm
Hi. I use Vox for my blog. Tips on getting the background the right size? I have tried on my own but can’t figure it out.
February 11th, 2009 at 1:03 pm
I loaded mine fine…but the problem is the body of my blog spills over onto the “margin” areas of the background (I purchased the Damask Floral Blog Couture)…I’ve never done this before…so it may be a simple fix! Basically, in “layperson terms”, I need to either shrink the area my type is being displayed in….or stretch the background so there’s more center space….clear as mud???? I saw someone said that you could adjust the margins, but I have no idea where to do that.
Thanks for any help!
February 12th, 2009 at 12:56 pm
Just wanted to say mine is up and running. I just made a new blog and I love it. So easy and when I followed the instructions, it worked great!!!
February 12th, 2009 at 5:22 pm
hi!
I have done what the instructions say to do, the only problem is it is not covering the whole background. My photobucket wont let me upgrade it to a 2mb file when i upload it, is there some other way?
BTW loving the site!
February 13th, 2009 at 5:49 am
Hello! I am having trouble just getting the file to download in photobucket. It keeps saying error after I paste the html and hit upload. Any suggestions? Thanks!
February 13th, 2009 at 6:30 am
When I look at my account, it says my order is processing. Maybe that is why it won’t let me download the blog background and header onto my computer or copy and paste the URL to photobucket? Just trying to troubleshoot! Anyone else have this problem?
February 13th, 2009 at 7:25 am
I think the designs are great but just a bit limited in what you can do with them in .jpg format. I will have to import the image into Photoshop and try to widen it for my blog - and possibly shrink the text in my blog to fit into the ‘type’ space provided?
Its a bit small for my layout.
Other than that - Very excited about this new site, well done!!
February 13th, 2009 at 9:41 am
First, love it!! I have got mine to work several times, but I keep running into the same problem. The layout image is too big (at 1 mb or 2mb - and I’ve tried all sorts of sizes). Only the 1 mb or 2 mg actuall fits properly on the side. My problem is when it is “fixed” it only shows the top portion of your beautiful design. When I have it on “repeat”, it is all broken up and doesn’t look right. I would love to have it fixed so you can see the whole design. I haven’t the foggiest how to do it. It is amazing I have got this far!!
Susan
February 14th, 2009 at 8:56 pm
Rhonna
She’s beautiful!!! Thanks so much for my new blog background.
I can’t believe I actually got it on there myself.
February 15th, 2009 at 2:13 pm
Great backgounds and wonderful directions! I finally got mine up! I love it!!! Thanks so much!
February 18th, 2009 at 1:49 pm
just uploaded one to my blog & i love it.
Thank you for the clear & easy to follow instructions!