Own custom font

Hi Vinay,

I followed the instructions to generate and add new fonts to my custom styles.css file. I also uploaded all of the font files. I couldn’t see any change so added the !important to each @font-face and again no change. Did I miss something in the instructions? Any help would be appreciated.

/* NEW FONTS */
/*! Generated by Font Squirrel (https://www.fontsquirrel.com) on April 11, 2017 */
@font-face {
font-family: ‘freelanduploaded_file’!important;
src: url(‘freeland-1-webfont.woff2’) format(‘woff2’),
url(‘freeland-1-webfont.woff’) format(‘woff’);
font-weight: normal;
font-style: normal;
}

@font-face {
font-family: ‘proxima_novablack’!important;
src: url(‘proximanova-black-webfont.woff2’) format(‘woff2’),
url(‘proximanova-black-webfont.woff’) format(‘woff’);
font-weight: normal;
font-style: normal;
}

@font-face {
font-family: ‘proxima_nova_rgbold’!important;
src: url(‘proximanova-bold-webfont.woff2’) format(‘woff2’),
url(‘proximanova-bold-webfont.woff’) format(‘woff’);
font-weight: normal;
font-style: normal;
}

@font-face {
font-family: ‘proxima_nova_rgbold_italic’!important;
src: url(‘proximanova-boldit-webfont.woff2’) format(‘woff2’),
url(‘proximanova-boldit-webfont.woff’) format(‘woff’);
font-weight: normal;
font-style: normal;
}

@font-face {
font-family: ‘proxima_novaextrabold’!important;
src: url(‘proximanova-extrabld-webfont.woff2’) format(‘woff2’),
url(‘proximanova-extrabld-webfont.woff’) format(‘woff’);
font-weight: normal;
font-style: normal;
}

@font-face {
font-family: ‘proxima_novalight’!important;
src: url(‘proximanova-light-webfont.woff2’) format(‘woff2’),
url(‘proximanova-light-webfont.woff’) format(‘woff’);
font-weight: normal;
font-style: normal;
}

@font-face {
font-family: ‘proxima_novalight_italic’!important;
src: url(‘proximanova-lightit-webfont.woff2’) format(‘woff2’),
url(‘proximanova-lightit-webfont.woff’) format(‘woff’);
font-weight: normal;
font-style: normal;
}

@font-face {
font-family: ‘proxima_nova_rgregular’!important;
src: url(‘proximanova-regular-webfont.woff2’) format(‘woff2’),
url(‘proximanova-regular-webfont.woff’) format(‘woff’);
font-weight: normal;
font-style: normal;
}

@font-face {
font-family: ‘proxima_novaregular_italic’!important;
src: url(‘proximanova-regularit-webfont.woff2’) format(‘woff2’),
url(‘proximanova-regularit-webfont.woff’) format(‘woff’);
font-weight: normal;
font-style: normal;
}

@font-face {
font-family: ‘proxima_novasemibold’!important;
src: url(‘proximanova-semibold-webfont.woff2’) format(‘woff2’),
url(‘proximanova-semibold-webfont.woff’) format(‘woff’);
font-weight: normal;
font-style: normal;
}

@font-face {
font-family: ‘proxima_novasemibold_italic’!important;
src: url(‘proximanova-semiboldit-webfont.woff2’) format(‘woff2’),
url(‘proximanova-semiboldit-webfont.woff’) format(‘woff’);
font-weight: normal;
font-style: normal;
}

Hi Vinay,

I have cleared the server cache. The cache plugin is restricted and control by WP Engine. Yes I have the fonts uploaded.

I have included login credentials in the private area.

Thank you
Lyse

Hi Vinay,

I have tried different options, but can’t make this work at all. I’ve moved all of my fonts under a sub-directory ‘”fonts” in my child theme and editing the CSS code URLs to point to that directory.

I clear the server cache often but no change. I can’t use the fonts.

I also tried the plugin you suggested, but I need to apply the font to a specific element. The element I want to apply the font to is the signature block contained in the slider caption content area. It’s not a specific element by itself.

I also tried inline CSS within the caption textbox, but it does not work and the code disappears when I save the page.

Boy, that seems complicated to do.

Do you have any other suggestions to make this work?

Thanks
Lyse

Hi

I restarted from scratch and all works as expected.

Thanks
Lyse