Thanks for the reply @Brookebot, really appreciate it.
@MaartenPex – your font links are all returning 404s, hence why it isn’t working. @brookebot kindly offered her child theme solution, which is this:
=======================================================
My @font-face works great w/ my child theme and this is how I did it:
I added this to child theme’s functions.php (child theme name is ‘brookebot’):
// Add Fetching Font
function myfetchingfont_headlink() { ?>
<link rel="stylesheet" type="text/css" href="http://brookebot.com/wp-content/themes/brookebot/fetching-font/fetching-regular.css">
<?php }
add_action('wp_head', 'myfetchingfont_headlink');
Then add entire font folder named “fetching-font” to child theme folder which contains:
fetching-regular.css
fetching-regular-webfont.woff2
fetching-regular-webfont.woff
fetching-regular-webfont.ttf
fetching-regular-webfont.svg
fetching-regular-webfont.eot
Here are the contents of the fetching-regular-webfont.css file:
@font-face {
font-family: 'fetchingregular';
src: url('fetching-regular-webfont.eot');
src: url('fetching-regular-webfont.eot?#iefix') format('embedded-opentype'),
url('fetching-regular-webfont.woff2') format('woff2'),
url('fetching-regular-webfont.woff') format('woff'),
url('fetching-regular-webfont.ttf') format('truetype'),
url('fetching-regular-webfont.svg#fetchingregular') format('svg');
font-weight: normal;
font-style: normal;
}
And finally to put it to use, here is an example of CSS for using it in my Custom CSS/JS box:
h1, h2, .impact-text-large {
font-family: 'fetchingregular';
}
I also had trouble getting the @font-face to work with my child theme until I finally figured out how to put everything in its right place. Maybe this can help solve issue. Just ignore if this does not help.
===============================
Hope that helps!
– Ed
.