BuddyBoss Home – Web Support Forums Themes Boss. theme How do I integrate a custom font the right way?

Viewing 2 posts - 1 through 2 (of 2 total)
  • Question

    #42355
    @jhoewner

    Hoi, folks.

    I’ve licenced a font with MyFonts. The package include an URL from which the fonts are loaded and a CSS that needs to be included. I’m currently hacking around in /wp-content/themes/boss/buddyboss-inc/theme-functions.php, adding enque-style stuff and such, but the font won’t show up and it just doesn’t feel right.

    On top of that, I also have the feeling that the font customizer is getting in the way – is there a single spott where I can disable it entirely, so that only my custom fonts I want are actually loaded?

    Details: I have two fontfaces – one I want to specifically assign to all things bold and the other to regular/normal text.

    The fuss is with the usual MyFontsWebfontsKit.css thing – yeah, I know, not my idea – I would’ve stuck with the Googlefont selection available. Before you ask: MyFontsWebfontsKit.css get’s loaded, that’s for sure!

    If worked myself through the stylesheets and replaced my development fallback font with all the names of the new font – but to no effect. I can carry on using grep and Chrome Devtools to coax my setup to use the new fonts globally, but there has to be an easer/right way to do this!

    Can anyone help?

    Answers

    #42423
    @vapvarun

    Hi @jhoewner, It will need some additional custom css, like i had did for Open Sans
    you can also include your font family and use them.

    
    @import url(http://fonts.googleapis.com/css?family=Open+Sans);
    body, p, #profile-nav span, #wp-admin-bar-shortcode-secondary .alert, .header-notifications a.notification-link span {
    font-family: 'Open Sans', sans-serif !important;
    }
    
    #wp-admin-bar-shortcode-secondary .alert,
    .header-notifications a.notification-link span {
    font-family: 'Open Sans', sans-serif !important;
    }
    
    .entry-meta .post-date time {
    font-family: 'Open Sans', sans-serif !important;
    }
    h1, h2, h3, h4, h5, h6 {
    
    font-family: 'Open Sans', sans-serif !important;
    
    }
    
    h1.main-title,
    
    #item-header-content h1,
    
    #fwslider .slide .title,
    .group-info li p:first-child,
    #item-statistics .numbers span p:first-child {
    
    font-family: 'Open Sans', sans-serif !important;
    
    }
    
    .is-mobile #mobile-header h1 a {
    font-family: 'Open Sans', sans-serif !important;
    }
    
    .is-desktop #mastlogo h1.site-title {
    font-family: 'Open Sans', sans-serif !important;
    }
    

    Regards
    Varun Dubey

Viewing 2 posts - 1 through 2 (of 2 total)
  • The question ‘How do I integrate a custom font the right way?’ is closed to new replies.