Site logo

Archived topic

Problem load font only mobile

9 replies · Started by alexis on October 4, 2022

Viewing posts 1–10 of 10

Hello,

I have a problem loading fonts on mobile on Chrome and Safari. I load the Satoshi-MediumItalic font for the introduction and conclusion parahgraphs. On desktop it's ok.

But no on mobile. No se meme italic. Yes this is the right font

Yes, I add this code and I import the police in the wordpress. On chrome and firefox in desketop I can see the Satoshi-MediumItalic font but on mobile not. It is applied on the introduction and conclusion paragraphs

/* Police */

@font-face {
    font-family: 'Satoshi-Regular';
    src: url('***/wp-content/uploads/2022/10/Satoshi-Regular.eot'),
        /* IE9 Compat Modes */
        url('***/wp-content/uploads/2022/10/Satoshi-Regular.eot#iefix') format('embedded-opentype'),
        /* IE6-IE8 */
        url('***/wp-content/uploads/2022/10/Satoshi-Regular.woff2') format('woff2'),
        /* Super Modern Browsers */
        url('***/wp-content/uploads/2022/10/Satoshi-Regular.woff') format('woff'),
        /* Pretty Modern Browsers */
        url('***/wp-content/uploads/2022/10/Satoshi-Bold.ttf') format('truetype'),
        /* Safari, Android, iOS */
        url('***/wp-content/uploads/2022/10/Satoshi-Regular.svg') format('svg');
    font-weight: 400;
    font-display: swap;
    font-style: normal;
}

@font-face {
    font-family: 'Satoshi-MediumItalic';
    src: url('***/wp-content/uploads/2022/10/Satoshi-MediumItalic.eot'),
        /* IE9 Compat Modes */
        url('***/wp-content/uploads/2022/10/Satoshi-MediumItalic.eot#iefix') format('embedded-opentype'),
        /* IE6-IE8 */
        url('***/wp-content/uploads/2022/10/Satoshi-MediumItalic.woff2') format('woff2'),
        /* Super Modern Browsers */
        url('***/wp-content/uploads/2022/10/Satoshi-MediumItalic.woff') format('woff'),
        /* Pretty Modern Browsers */
        url('***/wp-content/uploads/2022/10/Satoshi-MediumItalic.ttf') format('truetype'),
    /* Safari, Android, iOS */
    url('***/wp-content/uploads/2022/10/Satoshi-MediumItalic.svg') format('svg');
    font-weight: 500;
    font-display: swap;
    font-style: italic;
}

@font-face {
    font-family: 'Satoshi-Bold';
    src: url('***/wp-content/uploads/2022/10/Satoshi-Bold.eot'),
        /* IE9 Compat Modes */
        url('***/wp-content/uploads/2022/10/Satoshi-Bold.eot#iefix') format('embedded-opentype'),
        /* IE6-IE8 */
        url('***/wp-content/uploads/2022/10/Satoshi-Bold.woff2') format('woff2'),
        /* Super Modern Browsers */
        url('***/wp-content/uploads/2022/10/Satoshi-Bold.woff') format('woff'),
        /* Pretty Modern Browsers */
        url('***/wp-content/uploads/2022/10/Satoshi-Bold.ttf') format('truetype'),
    /* Safari, Android, iOS */
    url('***/wp-content/uploads/2022/10/Satoshi-Bold.svg') format('svg');
    /* Legacy iOS */
    font-weight: 700;
    font-display: swap;
    font-style: normal;
}

Hi Alexis,

How are you adding this? I can't seem to see it, viewing your site.

Can you try adding it in Appearance > Customize > Additional CSS.

I added it in my child theme you should see in the inspector. Line 830 css file generatpress-child

I see. Thank you for clarifying.

I tried viewing it on my end on mobile, and it seems the Font is loading as expected.

Can you confirm if this is the correct font?: https://share.getcloudapp.com/8Lu10dqG

If it is, can you try clearing your mobile's browser cache?

Sorry, Yes I had other people test the url, it's good. It must come from the operator because by emptying the cache it is not good

Probably. There's also Operator, Modem, Network cache sometimes. Glad it's working now!

This archived topic is closed to new replies.