Placing Logo in Header for Sight Theme

• 

  letmeberae · Member · Jan 4, 2014 at 9:23 pm

  • Copy link
  • Add topic to favorites

  Hi,

  I need help in trying to replace my header text with my site logo. I also would like that logo to be a hyperlink to the home page. I have the CSS customization upgrade; I just need directions of how to code this in.

  Thanks,
  Rae

  lovethyintrovert.com

  The blog I need help with is: (visible only to logged in users)

• 

  kaniamea · Member · Jan 5, 2014 at 2:54 pm

  • Copy link

  Hello Rae,

  Go to Appearance => Header and Select Image (that will let you put a logo image).
  Then scroll down the same page and uncheck “Show header text with your image”

  Hope this helps!

• 

  letmeberae · Member · Jan 5, 2014 at 5:16 pm

  • Copy link

  It did. I see when I was trying that before that I didn’t uncheck that box. I do have a slight issue now. My image looks so distorted. It’s not as clear as the other images on my page. I have it as a png version. Do I need to put it in a different format?

• 

  kaniamea · Member · Jan 5, 2014 at 5:36 pm

  • Copy link

  When I went to your website I did not see the logo, Rae.

  But I assume your logo image was stretched somehow. See right above the browse button it says “Images should be at least 580 pixels wide. Suggested width is 580 pixels. Suggested height is 150 pixels.”

  It is ok to use .png. Just resize it accordingly.

• 

  letmeberae · Member · Jan 5, 2014 at 6:10 pm

  • Copy link

  Yes I took it down because it looked so bad.
  I saw the suggested settings and adjusted it to that before posting, but I still got a very pixelated distorted look. I even tried to make it a little smaller than that but that actually made it worse.

• 

  kaniamea · Member · Jan 5, 2014 at 6:32 pm

  • Copy link

  Is the graphic size of your logo smaller than 580 x 150? If so, this can explain the distorted look.

  Here is another solution.

  Find the original size of your logo and using Photoshop or another graphic design program create a blank image with 580 x 150 dimensions. Then position your logo on top of this image so it does not look stretched. Save this and try to upload it as your logo.

• 

  thursdaycolectivo · Member · Jan 6, 2014 at 1:17 am

  • Copy link

  Does someone know the code to add a header before the menu bar. The example is: http://blog.monarcalanguage.com/

  Can I just copy the code in the CSS customization area?

  Thank you!

• 

  kaniamea · Member · Jan 6, 2014 at 9:01 am

  • Copy link

  Hi thursdaycolectivo,

  I see that the example site you posted is using the Twenty Twelve theme. So what they have done is to place a header image – http://blog.monarcalanguage.com/wp-content/uploads/2013/11/cropped-cropped-header2.png

  You can do that too. Go to Appearance => Header and select the header image you would like to place above the menu. Suggested width is 960 pixels. Suggested height is 250 pixels.