Comments on Tips for New Bloggers: Background Image for Blogger Template

wow..wow..woow..salute to you for the great info!

2007-11-13T01:12:00.000-04:00

wow..wow..woow..

salute to you for the great info!

God Bless you for this info...am fiddling around.....

2007-11-01T23:29:00.000-04:00

God Bless you for this info...am fiddling around..& ur page is the most useful I have come across for a newbie like me...THANKSS!!!

Hey bizwhiz, I'm using the Son of Moto template an...

2007-10-27T10:53:00.000-04:00

Hey bizwhiz, I'm using the Son of Moto template and I was wondering if there's any way to change the color (which is green) on the sides and top of the background. Thanks for your help!

Hi Choppy ChopYou are using Thisaway template whic...

2007-10-06T10:16:00.000-04:00

Hi Choppy Chop

You are using Thisaway template which has background images in the #main and #sidebar-wrapper. They probably block whatever else you have in the #body.

At the moment, you have a tiny image that you put in the center of the page, and it is not repeated. If you want to be able to see it and not have it blocked by the other images, try changing it to "repeat". Alternatively, have a larger image.

hi bizwhiz,i trying to complete my asgmnt here and...

2007-10-05T15:50:00.000-04:00

hi bizwhiz,
i trying to complete my asgmnt here and i cant seem to get the bground image right. i copied evrything u did..and it worked . the naruto image appeared, but when i changed the url to my own bg-image, its blank again. here is the url of my blog:

http://tyrochopsticks.blogspot.com/

and this is the image url :

http://i243.photobucket.com/albums/ff254/nanacholic/oui_oui_frame_by_bikikiz.jpg

Well, you will be happy to know hahaa that I FINAL...

2007-10-04T23:19:00.000-04:00

Well, you will be happy to know hahaa that I FINALLY did EXACTLY what you said...and it worked.
Thank you for helping me and mostly for your patience ;)

Candy

Hi CandyDo you not notice that you have inserted a...

2007-10-04T12:40:00.000-04:00

Hi Candy

Do you not notice that you have inserted an extra semi colon in that same line? Why is there a semi colon after "url" when there isn't one in any of our examples or answers?

Copy this and substitute the IMAGE URL with yours:-

background-image:url(IMAGE URL);

Hi again :)Well..... I just did it. I put the semi...

2007-10-04T11:12:00.000-04:00

Hi again :)
Well..... I just did it. I put the semi colon right ater it exactly like you said but it still isnt working for some reason.
Any other ideas?
I really appreciate all your help by the way.

Most kindly,
Candy

Hi CandyI refer to your latest private message. M...

2007-10-04T00:52:00.000-04:00

Hi Candy

I refer to your latest private message. My reply is still the same, add a semi-colon AFTER the line, as per our example, and it will solve your problem.

background-image:url
(image url);

Hi CandyYou wrote a private message. We do not ne...

2007-10-02T22:45:00.000-04:00

Hi Candy

You wrote a private message. We do not need your password to view the blog template. We have never acceded to any request to login to other accounts on readers' behalf. Indeed, you should never give your password to anyone.

In your case, you are saying that you have a background image that doesn't show. I suppose it is the one in the body? Just add a semi-colon after the line, as per our example, and it will solve your problem.

background-image:url
(image url);

Hi GingerNothing has happened and the image that I...

2007-09-26T07:55:00.000-04:00

Hi Ginger

Nothing has happened and the image that I did for you at that image location is still working fine. You can double-check that at your end by entering the image url into the browser.

Hi bizwhiz. It seems that the url link that you g...

2007-09-26T02:47:00.000-04:00

Hi bizwhiz.

It seems that the url link that you gave me http://www.blogpulp.com/imagehost/images/57286692 had expired. There is now a pink colour at the top of my content page. I really dont want to bother you any longer, but I just want to know what had happened. Thanks again!

Hi MrsYFAI took a look at your source code. You ha...

2007-09-24T23:04:00.000-04:00

Hi MrsYFA

I took a look at your source code. You have linked to an external stylesheet (yui.yahooapis.com) which sets the styles for your template. If you know where you have taken that from, see if they can help you change some of the settings. Whatever else you change will not have any effect because their style classes are named differently, e.g., #doc, #doc2 and so on.

This could also be taken from where you downloaded or changed your template to three columns. You did not change the template using our 3-column template guides. If you can remember which site you referred to, perhaps revisit that site and pose them your questions.

Here's a screen print of where I put it, I've trie...

2007-09-24T16:07:00.000-04:00

Here's a screen print of where I put it, I've tried a couple of other places as well and still nothing is happening???

#main-wrapper {
background-color:#4cc417;
margin-left: 1%;
width: 67%;
float: left;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

html > body #main-wrapper {
margin-left: 2%;
}

#sidebar-wrapper {
margin-right: 1%;
width: 25%;
float: right;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

html > body #sidebar-wrapper {
margin-right: 2%;
}

Hi MrsYFAIf it doesn't work, it is probably becaus...

2007-09-24T02:25:00.000-04:00

Hi MrsYFA

If it doesn't work, it is probably because the code is wrongly typed or it is inserted at the wrong place. Go to where you see #main-wrapper { and insert underneath it this (as per our example):-

background-color:#B38481;

If you see a color, that means it is at the correct location. You can then change the color code.

BizWhiz, You helped me on yesterday and I r...

2007-09-23T21:47:00.000-04:00

BizWhiz,
You helped me on yesterday and I really appreciate it, I have one more question. I have tried to change the background of my main wrapper (where my posts are) but it's not working? I'd like to try collor 4cc417, but no matter what color or background image I try to insert, it does not work???
yawdfromabroad.blogspot.com

I was thinking more of a translucent background.i ...

2007-09-19T15:23:00.000-04:00

I was thinking more of a translucent background.

i used opaque: 0.5;

But that made my text translucent also.

Any way i can make the text solid?

Hi inCLYNEdCSS allows background:transparent but t...

2007-09-19T14:36:00.000-04:00

Hi inCLYNEd

CSS allows background:transparent but that will show no background color. To have effects like you mentioned, you may have to use an image editing software like Paintshop Pro or Photoshop. When we have time to try it out, we shall write about it.

Hey... how do i make the sidebar with a coloured b...

2007-09-19T13:42:00.000-04:00

Hey... how do i make the sidebar with a coloured background and translucent like it were frosted.

http://inclyned.blogspot.com/

I want to make the side where the text are more obvious but also be able to see the picture in the background.

thanks a lot.
inCLYNEd

Thanks so much :D

2007-09-11T19:05:00.000-04:00

Thanks so much :D

Hi Thanita GlanceyFirst, I must say that your temp...

2007-09-08T09:19:00.000-04:00

Hi Thanita Glancey

First, I must say that your template looks odd, with all the negative margins. Any reason why you want all those in?

If you don't want the margin at the side, you can stretch the template such that it occupies the whole screen. The total width should also be about the same as your header.

You can consider changing to this:-

#outer-wrapper {
width: 980px;
margin:0 auto;
padding:10px;
text-align:left;
font: $bodyfont;
}

#main-wrapper {
width: 490px;
margin-left:25px;
float: left;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

#sidebar-wrapper {
width: 220px;
float: left;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

#newsidebar-wrapper {
width: 220px;
float: right;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

Hey there! I am so happy I found your site. Well...

2007-09-07T23:47:00.000-04:00

Hey there! I am so happy I found your site. Well it was like I tripped into it! You have been very helpful. I have a question for you, (and I'm sure you get many!); I changed my background using your suggestions and some trail and error. I can't get the right side of the background to just disappear (if this makes any sense)!
Basically, I want everything to line up under my image header but there's a little extra background image off to the right of the header and the body.
Here's my site: http://www.onehappytree.blogspot.com
Can you help me? Here's my email: littlemetg@gmail.com
help help please!
Thanks,
Thanita

Thanks for your help!

2007-09-07T02:06:00.000-04:00

Thanks for your help!

Hi esmileyNo, you don't have to change anything el...

2007-09-07T01:27:00.000-04:00

Hi esmiley

No, you don't have to change anything else. If at all, change the picture because the file size is too big. If you try putting in what you wrote into the template and refresh the page, you will probably see the background image, but after a very long time.

To determine if that is the problem, upload any small picture and choose to repeat it, instead of no-repeat. then view your blog page.

If you still want to use your picture, you can reduce the image size by half. You can optimize it further by lowering the quality. There are image optimizers available online. They can help to minimize the file size.

The blog in question is www.bylundbeat.blogspot.co...

2007-09-07T01:10:00.000-04:00

The blog in question is www.bylundbeat.blogspot.com

I am using minima template-ochre but with some tweaking of font colors and fonts. Do I need to change it to minima white and wipe everything out?