- This topic has 7 replies, 3 voices, and was last updated 3 years, 6 months ago by Tom.
-
AuthorPosts
-
October 7, 2020 at 8:04 am #1476757Lois
Hello,
I uploaded 3 custom fonts. All 3 are working beautifully on desktop. Two of the fonts are working on mobile, but one of the fonts is not working on mobile at all – it’s just showing Times New Roman where the script font should be.
Here is the CSS I’ve been using:
@font-face {
font-family: ‘astria’;
src: url(‘https://edwinakiernan.com/wp-content/themes/generatepress_child/fonts/astria_font-webfont.woff2’) format(‘woff2’),
url(‘https://edwinakiernan.com/wp-content/themes/generatepress_child/fonts/astria_font-webfont.woff’) format(‘woff’);font-weight: normal;
font-style: normal;}
@font-face {
font-family: ‘palominoscr_rgregular’;
src: url(‘https://edwinakiernan.com/wp-content/themes/generatepress_child/fonts/PalominoScr-Rg.woff2’) format(‘woff2’),
url(‘https://edwinakiernan.com/wp-content/themes/generatepress_child/fonts/PalominoScr-Rg.woff’) format(‘woff’);
src: url(‘https://edwinakiernan.com/wp-content/themes/generatepress_child/fonts/PalominoScr-Rg.ttf’) format(‘ttf’),
font-weight: normal;
font-style: normal;}
@font-face {
font-family: ‘mrdarcyregular’;
src: url(‘https://edwinakiernan.com/wp-content/themes/generatepress_child/fonts/mrdarcyregular-webfont.woff2’) format(‘woff2’),
url(‘https://edwinakiernan.com/wp-content/themes/generatepress_child/fonts/mrdarcyregular-webfont.woff’) format(‘woff’);
font-weight: normal;
font-style: normal;}
I’m baffled, because it’s only one of the fonts not working on mobile and I have no idea why.
It’s the script font in the box with the fountain pen graphic, just under the menu. Text reads: About
Same story for each of the menu pages. (and on the homepage, but the homepage is under construction and doesn’t have the menu on it yet)
Page URL to check: https://edwinakiernan.com/about
Thank you.
October 7, 2020 at 9:10 am #1476906LeoStaffCustomer SupportHi there,
Just to confirm, you’ve uploaded the font using the instructions here?
https://docs.generatepress.com/article/adding-local-fonts/October 7, 2020 at 9:21 am #1476928LoisYes. They’re not Google fonts. I downloaded the web files from each site used to purchase the fonts and uploaded the fonts, then used the @font-face steps. The strange thing is that the Palomino font is working perfectly on desktop but won’t show on mobile. The others are working on both desktop and mobile, and I did exactly the same install process with each of them.
October 7, 2020 at 9:26 am #1476942LeoStaffCustomer SupportAre you sure it’s working on desktop?
This is what I’m seeing:
https://www.screencast.com/t/FoNlCvTZOctober 7, 2020 at 9:42 am #1476966LoisIt’s working on my Chrome browser even when I open an incognito window… that’s so strange.
October 7, 2020 at 11:07 am #1477122TomLead DeveloperLead DeveloperI think the issue here is you’ve defined the name in your
@font-face
like this:font-family: 'palominoscr_rgregular';
But your CSS is calling for this:
font-family: "PalominoScr-Rg";
What happens if you change one of them to match the others?
October 7, 2020 at 2:06 pm #1477415LoisYes! That is working on mobile for me, now! Thank you so much!
Is it working when you look at it?
It should match the script font in the website title, at the top…
October 7, 2020 at 3:00 pm #1477483TomLead DeveloperLead DeveloperIt’s working for me now as well 🙂
Glad I could help!
-
AuthorPosts
- You must be logged in to reply to this topic.