Adding a logo to the Magazine Pro theme

[sammi]

Hi

I'm updating my site to the Magazine Pro theme. I want to add the logo to the top left (per the current site). I can't do this from the custom header section. On the current site I did this via an update to the CSS but am not sure how to do this with the HTML5 Magazine Pro theme.

Please let me know what code I need to add to place the logo in the top left.

Thanks!

http://everythingvelo.com/

[emasai]

These articles should help:

How To Add A Clickable Custom Header Image

http://blackhillswebworks.com/2013/05/10/how-to-replace-the-studiopress-background-header-image-with-a-real-image-logo/

---

Need Website Customization or a Responsive CSS fix? Contact Me
Lynne emasai.com

[sammi]

Thanks Lynne!

I've managed to include my logo but instead of appearing in the middle or hard left, I want it floated left and indented by say 80 pixels. How can I get this to happen?

[Brad Dalton]

What do you mean by indented?

---

Tutorials for StudioPress Themes.

[sammi]

If you look at my current site the logo is aligned with the menu bar and the content block. This is what I mean by 'indented' - it is not flush with the left hand side of the screen.

In the new Magazine Pro the content block does not sit flush with the left side of screen, instead it is "indented" and I'd like the logo to align with this also.

Hope this makes sense!

[emasai]

The logo is sitting in the header which is full browser width, so it will align with the edge of the browser. This is more for a full width background header image rather than a logo. Remove it completely from the custom header then do the following: Upload your logo via FTP to the theme images folder
Add it to css line 1184
.header-image .site-title a {
background: url(http://everythingvelo.com/wp-content/themes/NAME OF YOUR THEME FOLDER HERE/images/cropped-Logo.png) no-repeat;
THEN
REMOVE THIS LINE - background-position: center !important;
AND CHANGE - min-height: 200px;

You will probably find you have too much padding above the logo, so you can adjust this on line 1106 for .site-header

---

Need Website Customization or a Responsive CSS fix? Contact Me
Lynne emasai.com

[sammi]

Many thanks Lynne! It worked and also continued by coding education! Thanks again and enjoy the rest of the holiday season.

Sam

[inetworxx]

i tryed this in with a logo that Folder is outside the themefolder, but it did not Show the logo

anyone can help ?

[Author]

Posts