Customize header and footer

[Zipko]

Hi there,

Is there an easy way to make header and footer slimmer? They are too thick and taking too much space. (I already know there is no easy way to make them sticky).

Also, is there a way how to write the company name (same as “© 2021 RentalHive” on the picture) as a text, not as a link? I see that in the RentalHive demo it is exactly like I would like to have it, but for some reason it disappeared and I cannot get it back. I also consulted a web designer and we did not figure it out.

Another problem is with the “Terms of Use” and “Privacy policy”. In the demo they are on the right, but on my site they are on the left. Basically, I would like to have the footer exactly like in the demo. Company name as a text on the left all the rest on the right. I am not sure how did it get mixed up.

I would like to have the same for header. Company logo on the left and all the rest on the right, not in the middle as in the demo. I found one snippet (.header-navbar {margin-left:0!important;margin-right:0!important} .header-navbar__end {display:none!important}) which moves (Home, Properties, Blog, etc.) to the right, but at the same time the button “List a Property” disappears, which makes the css code unusable for me.

Thanks for your help.

[ihor]

Hi,

Most of these can be customized in Appearance/Customize. For example, please set the copyright notice in Appearance/Customize/Site Identity, you can also set the logo image there. Then the footer menu will be moved to the right side once the copyright notice appears, if you set a logo and assign menus to the header and footer locations in Appearance/Menus, the header and footer layouts will be the same as on the demo site. You can customize or remove the footer widgets in Appearance/Widgets section.

Hope this helps.

[Zipko]

Thank you Ihor.

Is there a way to set the header and footer thinner?

[andrii]

Hi,

Yes, you can do this by using CSS snippets, for example:

.header-navbar {
   padding-top: 1rem;
   padding-bottom: 1rem;
}
.site-footer {
	padding: 1rem 0;
}

But please note that it can require further customization.

[Zipko]

Thank you Andrii, it works.