Hi!
Before writing here I’ve been searching for previous posts on the matter but I didn’t find the right solution.
I need to change the header adding a background image sized 1019x144.
I set the image under Appearance->Header and added this to my custom css
.header-image {
margin-top: -144px;
}
I noticed though that following this procedure I completely covered the social icons, which are now disappeared. Also, I still got some white space between the background image and the menu beneath.
After some tries, I found a different solution. I basically changed the background and made the site title and description invisible. This way the header didn’t change size and I didn’t have to touch the margin values and I preserved the social icons bar. At the same time keeping the text of title and description should be good for SEO purposes.
Dear Movin,
thanks for your reply. I already tried with background-size 100% but I wasn’t very satisfied because with smaller screen the image get resized just fine but the header leaves a white space.
I’m thinking if I can maybe find a different solution, like making a much smaller header image (with just the logo, aligned to the left) + background color, site description made with custom font and another small image with the too small logos on the right side of the header (but this is seems to be the most complicated thing to do). This is just me thinking at solutions without knowing much about coding ^^
Yes you are right. It seems you can achieve this using the stated solution.
Unfortunately developing custom code for custom functionality is beyond the scope of support that we provide here.
If you are not a developer then you can consider hiring a developer to develop it for you. You can hire a developer from any freelance site. We recommend the developer https://www.upwork.com/freelancers/~011652ffec8865c6d5