I have been trying to put a header image with the company’s name and a picture in the masthead for a few days. (I had to walk away because it frustrated the crap out of me.) I am not a guru in coding by any means, but I’m not completely dumb either. I’ve walked through some of the different steps in the forum here where other people were having this problem or a similar one. Nothing is working.
I have tried adjusting the size of the image, I’ve tried the coding in the forum posts. Nada. It is still cutting off the image and only showing maybe the top 1/4 of the image. I’ve also tried doing the sticky/non-sticky and I’ve tried to do the full width and boxed.
I thought maybe it was just my blondness – but it’s not. Help help help!!!!
URL: http://a-vlaw.org
Hi Mandi
There are two options here, both will require image editing though.
Option One: Leave the image as is but it needs to be created larger, it needs to be 1080px wide. You can then insert the entire image as the logo via Appearance > Theme Settings > Logo and not add any masthead background image.
In order to do this, the following must be added to Appearance > Custom CSS:
/* Full header logo */ header#masthead { padding: 0 !important; } header#masthead hgroup { padding: 0 !important; } header#masthead hgroup .logo img { width: 1080px; } .main-navigation { margin: 0 !important; } body.responsive header#masthead hgroup .support-text, body.responsive header#masthead hgroup #header-sidebar { display: none !important; }The second option is that you separate the logo, save it as a PNG with a transparent background, just the logo, and add that via Appearance > Theme Settings > Logo. Then save your background image under Appearance > Customize > Page > Masthead Background Image. This image also needs to be re-created at 1080px wide.
Awesome. I have to redesign the logo/header anyway now as one of the managing attorneys decided he doesn’t like one building. (lol) So, I’ll try this today and build it on the dimensions that you gave me. I’ll let you know how this works.
Thanks for answering so fast!!!
For sure.
Working it up with the logo separate to the background image, using a transparent background for the logo, that I think would give you the most freedom to tweak things moving forward.
The full width logo is of course another way to go and might work here.