Changing my Logo size in Header

Hello,

First, thanks for all your help!

I know you can add the logo in the customize and general settings section, but how can I change the size ?

I want to make the logo smaller across the header and eliminate the whitespace on bottom and top ,and I am adding ph # to the logo on the right. is this is CSS? Can you help? Here is screencast:https://www.screencast.com/t/o1BhwzfIIN

and live page : http://test2alizee.fourteenair.com/family-hearing-healthcare/

Hi,

You can change make the logo image smaller with this Custom CSS:

.site-branding img {
    max-width: 300px !important;
}

Please add the above CSS to your Child Theme’s style.css or in case you haven’t setup a Child Theme already, then you can also add the CSS to wp-admin -> Appearance -> Customizer -> Additional CSS so you won’t loose the changes after Theme or WordPress updates.

Please let me know how it works.

Best Regards,
Csaba

Hi Csaba,

The code worked great to change logo size - Any way to eliminate the extra inch of “white space” in headerbelow logo? see here . red box https://www.screencast.com/t/nkd2wtMHf

Hi,

Yes, you can eliminate that white space with this Custom CSS:

.site-branding {
    padding-bottom: 0 !important;
}

Please let me know how it works.

Best Regards,
Csaba

Hi ,

how can I delete the white space around the logo? Your css line only delete the bottum space. I nwould like to have it borderless, like the header picture.

Best Regards

Hi,

Your logo is already borderless, if you don’t want to have white space on left and right, then your logo will be too big again, which you didn’t wanted, so if you modify this Custom CSS:

.site-branding img {
    max-width: 600px !important;
}

to

.site-branding img {
    max-width: 100% !important;
}

you’ll see what I meant.

Best Regards,
Csaba

Basicly I want to have the header img., but not like with the grey overlap. And it should be resizable responsive like the LOGO.

How can I do that?

Hi,

Sorry that’s not 100% clear for me, can you please clarify or post a link to an example to what you would like to achieve, so I can check if it’s possible.

Best Regards,
Csaba

We got two options for the header.

  1. Header image. That will option stretches left and right to the very end. But does not shrink when seen on tablet or smartphone. it is not responsive. It just cuts itself short. AND it has sort of a grey overlay.

  2. the logo option. THis on is responsive but it does not strechts through the screen left and right and up like the header. It has up , left and right , und even down a certain space.

I would like to combine the best of those two. The responsiveness from the logo with the streching capability from the header. I think that should be fairly easily possible by editing the logo in php. sadly i am a noob in programming.

Do you understand now?

Hi,

Sorry, it’s still not very clear what you want to achieve, can you, please post screenshots of the issues and point out on it what you want to achieve?

Best Regards,
Csaba