Community Forums › Forums › Archived Forums › Design Tips and Tricks › Enterprise Pro – Adjusted header height, then wp centered my image
Tagged: css, header image, image alignment, image height
- This topic has 6 replies, 2 voices, and was last updated 10 years, 7 months ago by jhguynn.
-
AuthorPosts
-
January 31, 2014 at 12:56 am #87924jon.jonesMember
Hi everyone,
I'd really appreciate some help with this. I am pretty new to WordPress and coding, and one of the first things I decided to tackle as I got a site set up was expanding the height of the header image in our Enterprise Pro theme purchased from StudioPress. The default heading image dimensions are a minuscule 320 x 80 px, which did not suit our logo at all.
I wanted to change the height specifically to fit the full logo in. And I read that changing the width of the logo required a bit more work, so I decided to keep it simple.
I changed 2 things: the css file and the functions file. All I did was change the "80" in these files under .header-image height to "153" which works great with our logo. Everything still says float: left and all that. The width on everything is still set to 320.
However, in doing this, our logo has been centered on the heading background instead of aligning left...what could be the issue? And how could I go about fixing that?
Thanks so much in advance,
Jon
http://ozarksvipmedical.com/January 31, 2014 at 1:08 am #87925jon.jonesMemberAnd I hate to add on here, but does anyone know what exactly would need to be edited in the css file to reduce the padding or white space between the logo and the top of the home page? I think I'll probably end up reducing the height of the image a little and trying to reduce the white space slightly, so the header isn't as tall is why I ask.
Again, thank you for your replies.
-Jon
January 31, 2014 at 11:29 am #87967jon.jonesMemberBump - If anyone more experienced than me could help that would be magnificent.
February 2, 2014 at 6:23 am #88145jhguynnMemberBump. I had the same issue with the same theme: I modified functions.php and css to accomodate a header (logo) image of a different size, and mine got centered as well. Pissing me off. Any help on this?
February 2, 2014 at 6:27 am #88147jhguynnMemberJon:
By the way, here is the css I modified to change the padding around my logo:
Site Header ---------------------------------------------------- */ .site-header { background-color: #fff; min-height: 150px; } .site-header .wrap { padding: 10px 0; /* --- original value: padding: 40px 0; --- */ padding: 1rem 0; /* --- original value: padding: 4rem 0; --- */ }
See if this gets the result you're after. Note: you may have to modify 'min height' to suit as well. Don't forget to include the padding in that calculation (i.e. min height = image height + 2X padding for top & bottom).
February 2, 2014 at 11:30 am #88194jon.jonesMemberjhguynn,
I appreciate the help on the padding issue. If you're still looking for a solution to the header image issue, I figured it out. It's a super easy solution.
You've already modified your style and functions files, so your head image height is set to whatever you need it to be. By default the theme is set to center header images if there is nothing in the right header. All you need to do is add a widget to the right side header - an empty text widget works.
I added simple social icons to the right side header with a text widget underneath it. As soon as you do that it will left align your header image.
Hope that helps if you still needed it.
February 2, 2014 at 12:15 pm #88198jhguynnMemberJon:
Thanks for the fix. You wrote:
By default the theme is set to center header images if there is nothing in the right header. All you need to do is add a widget to the right side header – an empty text widget works.
How do you know that? I find it odd. Glad to have a fix for now, but I'll bump this back to the top to see if there may be a glitch in the theme. It is relatively new, after all. My preference would be to control logo position with funcrions.php and css only, and not have to duct tape an empty text widget in the right header for it to work.
We'll see what pops up. Thanks again.
-
AuthorPosts
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.