How do I add my logo to my website front page ?

• 

  fight4news · Member · Mar 31, 2014 at 10:23 pm

  • Copy link
  • Add topic to favorites

  I have a logo I want to had to the top of my website.

  I know I have to first: I uplaod it by ‘Custom Header’.
  I know secondly I can go to ‘CSS’ then add: .header-image > img { margin: 0 auto; padding-bottom: 20px; width: 300px; } .masthead .branding { display: none; }
  The logo will then be small on the left of my website. How do I get this to the ‘Middle’ of the page at the top ? Or how can I get the logo to the ‘Right’ hand side of the page ?

  Please help ?

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

• 

  designsimply · Member · Apr 1, 2014 at 11:19 pm

  • Copy link

  I checked http://fight4news.com/ and I see that you are currently using the Broadsheet theme.

  If you go to Appearance > Customize > Headers and look at the top of the panel, you’ll see that the recommended header image size is 1140×150 pixels.

  That sounds too big for a logo, so I would recommend using a CSS image replacement technique instead. You do need to upload your logo to your blog, but I think you should upload it to the media library and not the custom header.

  The CSS example you included looks like it might be for a different theme maybe? Note that CSS is theme-specific, so CSS written for one theme won’t work in another.

  Here’s an example of adding a logo above the “Fight4News.com” site title text on your site:

  .masthead .branding h1.logo a:before {
  	content: url("http://s.wordpress.org/about/images/wordpress-logo-notext-bg.png") no-repeat;
  	display: block;
  }

  I used a WordPress logo just as an example, you should replace the url() value with a link to your own image after you upload it to your media library.