Menu Font

[James]

Hi,

I would like to change the font on the nav bar of my website to Friz Quadrata, the rest of the site is currently that font but its not in the font family within generatepress but it is loaded onto the website because my website building software finds it.

Current CSS i have on the site is

@media (max-width: 768px) {
.mobile-header-navigation .site-logo.mobile-header-logo img {
height: 68px;
}
.menu-toggle, .main-navigation .mobile-bar-items a {
line-height: 108px;
}
}

if this can be altered to include the font change.

[David]

Hi there,

can you share a link to your site so i can to see whether your page builder is loading the font across the entire site

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[James]

David,

jamesalowe.co.uk/AW website currently in construction stages

[David]

Try this CSS:

.main-navigation .main-nav ul li a {
    font-family: "Friz Quadrata", Verdana, Arial, sans-serif;
    font-weight: 100;
}

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[James]

David,

Unfortunately that doesn’t work, ive send you temporary credentials

James

[David]

Did you add the CSS to Customizer > Additional CSS?
If so i think theres some bad spacing characters in the CSS that is causing an issue.

Try replacing it all with this:

@media (max-width: 768px) {
    .mobile-header-navigation .site-logo.mobile-header-logo img {
        height: 68px;
    }

    .menu-toggle,
    .main-navigation .mobile-bar-items a {
        line-height: 108px;
    }
}

.main-navigation .main-nav ul li a {
    font-family: "Friz Quadrata", Verdana, Arial, sans-serif;
}

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[James]

David,

Spot on that seemed to of worked that time

Thanks
James

[David]

Glad to hear that!

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Author]

Posts