Hello, your custom font does not appear in the Font Family customizer dropdown?
Did you check at the end of the dropdown?
I’m having a similar issue. I created the font file using font squirrel, and I’ve updated my child theme with the following:
style.css
@font-face {
font-family: 'hand_of_seanregular';
src: url('handofsean-webfont.woff2') format('woff2'),
url('handofsean-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'gt_walsheimbold_oblique';
src: url('gt-walsheim-bold-oblique-webfont.woff2') format('woff2'),
url('gt-walsheim-bold-oblique-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'gt_walsheimbold';
src: url('gt-walsheim-bold-webfont.woff2') format('woff2'),
url('gt-walsheim-bold-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'gt_walsheimmedium_oblique';
src: url('gt-walsheim-medium-oblique-webfont.woff2') format('woff2'),
url('gt-walsheim-medium-oblique-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'gt_walsheimmedium';
src: url('gt-walsheim-medium-webfont.woff2') format('woff2'),
url('gt-walsheim-medium-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'gt_walsheimregular_oblique';
src: url('gt-walsheim-regular-oblique-webfont.woff2') format('woff2'),
url('gt-walsheim-regular-oblique-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'gt_walsheimregular';
src: url('gt-walsheim-regular-webfont.woff2') format('woff2'),
url('gt-walsheim-regular-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}
and I’ve updated my funcitons php with this
function ocean_add_custom_fonts() {
return array( 'hand_of_seanregular', 'gt_walsheimbold_oblique', 'gt_walsheimbold', 'gt_walsheimmedium_oblique', 'gt_walsheimmedium', 'gt_walsheimregular_oblique', 'gt_walsheimregular' );
I can see each of the fonts in the dropdown menu, but it doesn’t actually change the font to the one I’ve uploaded.
Hello @vireomedia, your fonts are in a “fonts” folder in your child theme, right?
So you only need to add “fonts/” before your fonts name, for example:
@font-face {
font-family: 'hand_of_seanregular';
src: url('fonts/handofsean-webfont.woff2') format('woff2'),
url('fonts/handofsean-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}
Yes, my fonts are in my child theme, and I updated url to what you have above. I’m still unable to get the fonts to pull.
The dropdown option shows, but the font just shows as a default font.
Can you show me the site where you have this issue?
And in what parts you use the custom fonts? Titles, menus, content? Because I see that your use the Poppins font right now.
Hi Nicolas, same problem here with Riesling font :
https://www.florence-recanzone.com
Regards.
Jean
Hello @momo-fr, if you check on your console, your font return a 404 error.
Hi,
If you take a look at this page: https://impacthubboulder.com/home-with-video-demo/
The part that says “Come for Coworking, stay for community” is supposed to be in Hands of Sean
Here’s an example of what Hands of Sean should look like: https://www.dafont.com/hand-of-sean.font
-
This reply was modified 8 years, 8 months ago by
vireomedia.
Hi @vireomedia, I downloaded the file from dafont, I added the font in a “fonts” folder in my child theme, I added this code in my style.css:
@font-face {
font-family: 'Hand Of Sean';
src: url('fonts/handsean.woff') format('woff');
}
I added this code in my functions.php:
function ocean_add_custom_fonts() {
return array( 'Hand Of Sean' );
}
I selected the font from the customizer and everything works without problem.
Thank you,
This solved my issue! Thank you for going the extra mile for me!!!!!
Hi, glad that the problem is solved 🙂
