How do I integrate a custom font the right way?

[Joerg]

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?

[Anonymous]

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