Showing posts with label background images and colors. Show all posts
Showing posts with label background images and colors. Show all posts

Tuesday, April 10, 2007

How to change background colors in your template

Kaia rites:
I am summoning help, and I think you can help! I am trying to change the background on my blog, and, to no avail, have succeeded. Well, Let me take that back. I succeeded, but it messed everything else up. So, with this effort, I am trying to do two things: 1. change my background, and 2. change the "posting column" background to a solid color because the background is a print. We are not HTML savvy to say the least, but nonetheless we are trying to figure out how to do this. Can you please offer some assistance?

To change fonts and colors, ferst klik the "Layout" link frum yer dashbord (klik to biggify):



Then, klik the "Edit Fonts & Colors" link (1) under the Template tab (klik to biggify):


To change the Page's Backgrownd Color, klik "Page Background Color" in the selekt box (2), then pik a color on the rite by klikking on it (3). Yoo can also enter a hex code in the box to the rite of all the color swatches.

To change the mane kolumn's backgrownd color, klik "Main Background Color" in the selekt box (2) and proseed as above.

Win yer done, klik the oranje "SAVE CHANGES" buttun. If yoo skrew up, klik the bloo "CLEAR EDITS" buttun.

Kaia, it's entirely possibul that yer blog template is not set up this way, so if yoo don't see the same stuff as above, tell me whut yoo do see so I can walk yoo thru it.

To change yer bakgrownd images, follow the instrukshuns heer, and if it duzn't werk, pleeze leeve a deetaled deskripshun of whut yoo did in the comments feeld and we'll look into it for yoo!

Sunday, February 4, 2007

My bakgrownd duzn't show up in IE!

My vary speshul frend, Daisy the Curly Cat, rites:

I added a special Valentine background/wallpaper to my page. It shows up in Firefox, but not if you use IE. I can't figure this one out!

Daisy, it's a qwik fix:

1) In yer style sheet sekshun, go to ware yer body styles are --- the part that looks like this:

body {
margin: 0;
padding: 0;
border: 0;
text-align: center;
color: #555555;

background: #fff2fc top center repeat-y;
font-size: small;
background:url (
http://images.bigoo.ws/content/saint_valentine/background/sv_background_0.gif)repeat;
}

and reemove the style that's displayed in green above: background: #fff2fc top center repeat-y;

2) Then, skrole down past ware yer style sheet ends (</style>) -- abowt 6 lines down frum that is yer body tag. It kurrintly looks like this: <body>

Add this: background="http://images.bigoo.ws/content/saint_valentine/background/sv_background_0.gif"
So it looks like this:
<body background="http://images.bigoo.ws/content/saint_valentine/background/sv_background_0.gif">

That shood make it werk in both Firefox and IE!



Daisy asks anuther qweschun:

"I have just one other little question. Do you know how I can remove the little blank space at the very top of my page? It is only about 1/4" high."

Daisy, that's akshully an image wrapping the top of yer mast. To reemoove it, go to the OUTER-WRAPPER style in yer style sheet. It looks like this:

#outer-wrapper {
margin: 0 auto;
border: 0;
width: 742px;
text-align: left;
background: #ffffff
url(http://www.blogblog.com/moto_ms/innerwrap.gif) top right repeat-y;
font: normal normal 110% Arial, sans-serif;
}
and reemoove the line (in red above) that deefines the stile for yur wrapper bakgrownd image:

background: #ffffff url(http://www.blogblog.com/moto_ms/innerwrap.gif) top right repeat-y;

so that the outer-wrapper stile now looks like this:

#outer-wrapper {
margin: 0 auto;
border: 0;
width: 742px;
text-align: left;
font: normal normal 110% Arial, sans-serif;
}
Thare's still a space between yer header and the top margin, but I can't figyer owt how to make it go away. Reemooving the margin in the body tag didn't werk. But it did point owt a problim in yer HTML, Daisy...

Down by yer body tag, yoo have dooplikit body tags, and one is clozed owt beefore it shood be. It looks like this:

<body>
<div class="navbar
section" id="navbar"><div class="widget Navbar"
id="Navbar1"><iframe id="navbar-iframe" marginwidth="0"
marginheight="0"
src="http://www2.blogger.com/navbar.g?blogID=2240334138501910154"
frameborder="0" width="100%" scrolling="no" height="30"></iframe
>< div id="space-for-ie">

<body
background='http://images.bigoo.ws/content/saint_valentine/background/sv_background_0.gif'>
</body>
and the parts in red need to be reemooved!

Tuesday, January 9, 2007

How do I add a background image/wallpaper to my blog?

Mu shue Pooh King Cat asks...
I luff this blog skeezix fanks we haave some question how do you cange the walper on the back and we tryed to get it from your template but we could not figer out the html. please help ps you should do a fing on how to link in bloger beat uses it so much easer

To add a background image/wallpaper to yer blog, yoo need to add code to the body tag of yer template. The body tag comes rite after the closing head tag. (Yoo won't be doing anything with the head tag, but it mite make it eezier to find yer body tag if yer serching for both.) So yer looking for this:

</head>
<body>



Now, yoo need to add the bakgrownd image to yer body tag so it looks like this:

<body background="http://www.photobucket.com/images/yourImage.gif">

Of korse, yoo'll need to change the image path in the ixzampul above to reeflekt the path to yer bakgrownd image.