kadence will not recognise @font-face CSS

[darren]

darren

April 10, 2024 at 9:10 am

No matter what, Kadence will not recognise the font I have added.

This is in my Additional CSS section.

@font-face {
font-family: 'FoundryMonoline-ExtraBold';
font-style: normal;
font-weight: 400;
src: local url('http://localhost/dsstorage/wp-content/uploads/fonts/FoundryMonoline-ExtraBold.woff'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

I added this as a PHP snippet in a custom code plugin:

function my_kadence_custom_fonts( $system_fonts ) {

$system_fonts[ 'FoundryMonoline-ExtraBold' ] = array(
'fallback' => 'Foundry, Arial, sans-serif',
'weights' => array(
'400',
),
);
return $system_fonts;

}
add_filter( 'kadence_theme_add_custom_fonts', 'my_kadence_custom_fonts' );

What should be happening is that the font I added via CSS become visible in the list of base fonts, but it won’t. This is very basic CSS and I did this all the time with classic WP themes.

Sadly, these block themes have become incredibly complicated to the point that the various overrides cancel each other out. Can anyone give me a pointer as to what is happening here?