Header height issue

Hi there,

Can you share the link to the site in question here?

https://expiry.link/po6d9

Also pls check in mobile view

• This reply was modified 1 year ago by ramsypal.

Hi there,

it your Logo image, the original image is 500px wide by 500px high.
The image needs to be cropped to the size, renamed and re-uploaded to your site.

Oh, I see. What size do you recommend?

The size is immaterial really.
The issue is the image needs to be cropped so you do not have a lot of empty space around the image. So you should crop it to the rectangular shape of the image.

Okay, I resized the image to 250px wide by 150px height and cropped it, but I’m still experiencing the same issue.

• This reply was modified 1 year ago by ramsypal.

That fixed the header size issue.
The additional space below the header comes from the themes Container Padding.
When building a Full Width page layout like that, you should set the Content Container to Full Width in the page editor:

https://docs.generatepress.com/article/content-container/

This will make the page full width and remove the themes padding.
You don’t need to use Align Full options on the blocks, you should remove that.
And then include some Left and Right Padding in your Container blocks.

Hey, the guide was really helpful. Setting the page to full width removed some extra padding, but if you check the mobile view, you’ll notice that the filter icon is still within the header.

and I didn’t get this part – “You don’t need to use Align Full options on the blocks, you should remove that.
And then include some Left and Right Padding in your Container blocks.”

do you mean this settings – https://share.zight.com/KouNnbj7

Select the top most Container Block. And in Layout settings, there are the BLOCK ALIGNMENT options there you have the Container set to ALIGN FULL. Set it to Default

Regarding the filter button, its not in the Header, its at the top of the main content it just happens to have the same color background as the header.
The Theme doesn’t control that as its added by a plugin.

Got it, thanks for breaking it down for me, I really appreciate it. There’s a bit of a learning curve for me.

Okay, so the spacing issue is sorted out. Now, how can I make the header transparent?

You can change the header background color at customizer > colors > header.

Hey its not changing – https://share.zight.com/7KuXz1qg

Hmm I believe it is working. When you set the header background color to transparent, the body background shows through the header.

Try setting the header background color to another solid color and you should see it working.

You’re absolutely right – https://share.zight.com/Blu2bLnZ

There is another padding, underneath the header

Looks like it’s coming from another plugin: https://www.screencast.com/t/0YmutFAZ