Knitter's Review Forums
  The online community for readers of Knitter's Review.
  This week: Always know how much yarn you need
   > Have you subscribed yet?
Knitter's Review Forums
KR Home | My Profile | Register | Active Topics | Private Messages | Search | FAQ | Want to make Betty happy?
Username:
Password:
Save Password
Forgot your username or password?

 All Forums
 Knitting on the Web
 Blog Talk
 Images in Header
 New Topic  Reply to Topic
 Printer Friendly
Author Previous Topic Topic Next Topic  

KathyR
Permanent Resident

New Zealand
2969 Posts

Posted - 11/27/2006 :  7:20:42 PM  Show Profile  Visit KathyR's Homepage Send KathyR a Private Message  Reply with Quote
I am trying to tweak my blog to make it more "mine" (visitors may note that it does look a little different than it did originally!) and would like to place an image in the main header with the blog name superimposed on it. Others have done it before me so I know it can be done. But I am not a computer geek nor am I very html familiar. I have tried searching various blogger helps but have not found anything satisfactory.

I did actually manage, at one point, to get a picture on the header but the blog name was beside it, instead of on top of it, and I was not able to stretch the image the full width of the header. Anyone, HELP!! Please!

KathyR
Rudeness is the weak man's imitation of strength.
My Blog

jacquieh
New Pal

12 Posts

Posted - 11/28/2006 :  05:41:33 AM  Show Profile  Visit jacquieh's Homepage Send jacquieh a Private Message  Reply with Quote
This is just the sort of question we can answer at Bloggers' Paradise

This is what you need to do:

Find the part of your template that looks something like:


  #header {
    width:660px;
    margin:0 auto 10px;
    border:1px solid #ccc;
   }


Add in a background-image attribute like this


  #header {
    width:660px;
    margin:0 auto 10px;
    border:1px solid #ccc;
   background-image:url("YOUR URL");
   }



where YOUR URL is the URL of your image which should be cropped to a suitable size.

If there is already a background there, replace the exsiting URL with yours.

If you don't like what that does please show us exactly what your header style looks like and tell us what you don't like about it.





Jacquie

http://jacquie.typepad.com
http://bloggersparadise.forumhum.com/
Go to Top of Page

KathyR
Permanent Resident

New Zealand
2969 Posts

Posted - 11/28/2006 :  1:44:45 PM  Show Profile  Visit KathyR's Homepage Send KathyR a Private Message  Reply with Quote
Thanks so much Jacquie! I will try that and post back here on how it goes. I think what I have already tried was similar but I'm not sure! Time will tell. A blog is a great learning process and they say you are never too old to learn!

KathyR
Rudeness is the weak man's imitation of strength.
My Blog
Go to Top of Page

kpc19011
Chatty Knitter

146 Posts

Posted - 11/28/2006 :  1:52:29 PM  Show Profile  Visit kpc19011's Homepage Send kpc19011 a Private Message  Reply with Quote
Hi KathyR, I noticed that we both have the same blog template and I too have been wanting to change my header bar to look more...me! Well, here is what I did, I hope this helps.

Create an image that is 740 pixels wide. Upload the picture onto a Draft post. Copy the URL from that post (it's the http between the quotes). Click on your Template button and scroll thru the code till you come to...

/* Blog Header
----------------------------------------------- */
@media all {
#header {
background:#476 url("http://photos1.blogger.com/your-header.jpg") no-repeat left bottom;


Paste the URL into the quote marks. Save template and then view blog. I still have to fingure out how to edit or remove my Blog Name & Tag...it's hard to read off the background...I'll figure it out soon, I hope:)



Kris
SouthSub-Chicago

Just Let Me Finish This Row
http://kniftyred.blogspot.com
Go to Top of Page

KathyR
Permanent Resident

New Zealand
2969 Posts

Posted - 11/29/2006 :  8:52:33 PM  Show Profile  Visit KathyR's Homepage Send KathyR a Private Message  Reply with Quote
Thanks, Kris. I have got part of the image on my header but am not yet totally happy with it. Only the bottom part of the photo is showing (at least it stretches right across now!) and the bottom corners are square instead of rounded. But it is getting there! A work in progress. When the weather clears up again (it is raining cats and dogs again right now with a light dusting of snow on the hills behind us - and we are supposed to be going into summer here!) I'll get back out in the garden and see if I can get a few more photos and try and get something the right size. In the meantime, my blog looks better, to me, than it did.

KathyR
Rudeness is the weak man's imitation of strength.
My Blog
Go to Top of Page

jacquieh
New Pal

12 Posts

Posted - 12/01/2006 :  12:04:15 AM  Show Profile  Visit jacquieh's Homepage Send jacquieh a Private Message  Reply with Quote
The rounded corners are actually part of the original images - the corners are the same color as the background so it appears that the image itself has rounded corners even though it is really square cornered.

It will only show as much of the background as it needs to to accommodate the text in the header box. You can change which part of the picture it shows by changing the word 'bottom' to 'top' or 'center' in the #header clause.




Jacquie

http://jacquie.typepad.com
http://bloggersparadise.forumhum.com/
Go to Top of Page

KathyR
Permanent Resident

New Zealand
2969 Posts

Posted - 12/01/2006 :  4:41:35 PM  Show Profile  Visit KathyR's Homepage Send KathyR a Private Message  Reply with Quote
Thanks, Jacquie. Looks like I may have to be content with having square corners. I will try out changing the word in the header clause when I have some time to play.

I really do appreciate all the help I have been getting on this. I really am flying fairly blind when it comes to this type of thing.

KathyR
Rudeness is the weak man's imitation of strength.
My Blog
Go to Top of Page

lella
Permanent Resident

9714 Posts

Posted - 12/02/2006 :  12:30:19 AM  Show Profile Send lella a Private Message  Reply with Quote
I loved the way you tweaked your blog header. It's very beautiful.

Lella
[img]http://www.geocities.com/zippianna/carrot.gif[/img]

Blabbity Blog
Go to Top of Page

Jane
SustaYning Member

USA
4391 Posts

Posted - 12/02/2006 :  03:55:52 AM  Show Profile  Visit Jane's Homepage Send Jane a Private Message  Reply with Quote
My blog has the same template, too. My header photo seems to look different on different computers and in different browsers, but I just let it be. I went into the template and removed all the code for the rounded corners, and left all the little do-dads that I like.

You can also change the font, color, and size of your title and description by altering your template in the same manner. Mine is Fine Hand, with an alternate of Trebuchet; again, which one is displayed depends on each person's computer.

I like your header, Kathy - and Kris' Clapotis, too (Lella already knows that I love hers!).

Jane

Blog: Not Plain Jane
Photos: My Flickr Album
Go to Top of Page

KathyR
Permanent Resident

New Zealand
2969 Posts

Posted - 12/02/2006 :  2:55:44 PM  Show Profile  Visit KathyR's Homepage Send KathyR a Private Message  Reply with Quote
Since I have been attempting to tweak the look of my blog I have been taking more notice of the look of other people's blogs. You guys have cool-looking blogs!

I took your advice, Jacquie, and centred the image in the header. I like it a lot better now. Thank you! Now, maybe a little colour tweaking next!

KathyR
Rudeness is the weak man's imitation of strength.
My Blog
Go to Top of Page
  Previous Topic Topic Next Topic  
 New Topic  Reply to Topic
 Printer Friendly
Jump To:
Knitter's Review Forums © 2001-2014 Knitter's Review Go To Top Of Page
This page was generated in 0.53 seconds. Snitz Forums 2000
line This week's bandwidth
kindly brought to you by


and by knitters like you.
How can I sponsor?


line subscribe to Knitter's Reviwe