Docs

[jensmith3]

Hello,

My site is currently on the temporary url of http://103.37.8.129/~mossvale/

As you will see, the header is cutting off the top of each page. How do I adjust this to ensure all pages have the same distance between the header and the start of the page assuming I don’t add any additional space?

I’d also like to move the navigation bar to the bottom of the header area and aligned from the right.

And finally, how do I add some space between the top of the page and the phone number?

As always, many thanks for your help.

Kind regards,

Jenny

[jensmith3]

This reply has been marked as private.

[jensmith3]

Hello again,

Could I also add a further question. How do I change either the footer background colour or the colour of the footer text? I have put text in the footer but can’t see it.

Many thanks and kind regards,

Jenny

[John Ezra]

Hi there,

Thanks for writing in! You can add this under Custom > CSS in the Customizer or in your child theme’s style.css file.

.x-container.max.width.main {
    margin-top: 180px;
}

.contact {
    margin-top: 20px;
}

Note to get the navbar menu to be below the logo you need to set your header layout to stacked. Your CSS may need some adjustment after this.

Appearance > Customize > Header > Logo and Navigation > Layout >> Set to Stacked.

For the footer, use this:

footer.x-colophon.bottom {
    background: #222222;
}

.x-colophon.bottom .x-colophon-content{
    color:#ffffff;
}

.x-colophon.bottom  ul#menu-main-2 li a,
.x-colophon.bottom .x-nav li:after {
    color: #fff;
}

.x-colophon.bottom  ul#menu-main-2 li a:hover{
    color: #ff8902;
}

.x-social-global a {
    color: #fff;
}

Just change the values as needed. Hope this helps – thanks!

[Author]

Posts