Topic: Local font failing to upload

somethingoffreedom
April 25, 2024 at 3:14 am

I have been trying to upload a local font to my website following the instructions in the documentation here: https://docs.generatepress.com/article/adding-local-fonts/

I have followed the instructions and put in the code snippet, but still when I try to upload to the media library I get the below message:

“commissioner-v20-latin-regular.woff2” has failed to upload.
Sorry, you are not allowed to upload this file type.

Are you able to help?

Thanks!
David
April 25, 2024 at 6:09 am

Hi there,

the snippet you added, in the code snippet plugin where did you choose to run the code ? It needs to be Everywhere or in the Admin

If it still don’t work then it may be a server persission is overwriting that.

The alternative ( for now ) would be to use a Child Theme for loading the fonts. Is that a possibility ?
Or if you’re ok waiting a little while we have something coming to make this a lot easier.
somethingoffreedom
April 25, 2024 at 6:42 am

Hi David,

Thanks for getting back to me. I have the code running everywhere but it just doesn’t seem to allow any fonts to upload (I tried a few different ones to see if that made a difference somehow!).

I’ve never used a child theme before personally – how would I be best to set this up? I know there are plugins that can do this for you but are there other ways that are a better option?

In terms of what you have coming to make it easier, do you know roughly when that might be available?

Thanks for your help!

Ying

April 25, 2024 at 12:38 pm

Try using this PHP code instead:

function add_custom_upload_mimes( $mimes ) {
    // Add support for font file types
    $mimes['ttf'] = 'font/ttf';
    $mimes['otf'] = 'font/otf';
    $mimes['woff'] = 'font/woff';
    $mimes['woff2'] = 'font/woff2';
    $mimes['eot'] = 'font/eot';
    $mimes['svg'] = 'font/svg';
    
    return $mimes;
}
add_filter( 'upload_mimes', 'add_custom_upload_mimes' );

Let me know if this helps!

somethingoffreedom
April 25, 2024 at 2:41 pm

Unfortunately I’m still getting the same message saying it’s not allowed to upload this file type.

Alvind

April 25, 2024 at 5:30 pm

Hi there,

Replace Ying’s PHP filter with this one:

add_filter( 'upload_mimes', function( $mimes ) {
    $mimes['woff']  = 'application/x-font-woff';
    $mimes['woff2'] = 'application/x-font-woff2'; 
    $mimes['ttf']   = 'application/x-font-ttf';
    $mimes['svg']   = 'image/svg+xml';
    $mimes['eot']   = 'application/vnd.ms-fontobject';

    return $mimes;
} );

I can confirm that this one is working because I just tested it.

somethingoffreedom
April 26, 2024 at 12:49 am

That’s allowed me to upload now – thank you!

I am testing the font on a staging website and for some reason when I add typography it only seems to change the content on the home page itself, as opposed to for my posts as well. Is there a reason why it would be doing this?

It also only seems to change it when I’m in the appearance – customise area of my wp-admin, as opposed to when previewing how it looks on the staging site. I hope that makes sense?

Thanks for your help!
Alvind
April 26, 2024 at 12:53 am

Have you setup the Typography Manager under Customize > Typography?
somethingoffreedom
April 26, 2024 at 12:55 am

Sorry I wasn’t more clear – that’s where I meant I was making the changes and adding typography settings.
David
April 26, 2024 at 4:23 am

Is it possible to see the site ? I can take a look at how the fonts are loading on the frontend
somethingoffreedom
April 30, 2024 at 12:23 am

Sorry for the slow reply. It’s for a staging site so I have included the link in the private info.
David
April 30, 2024 at 5:05 am

OK, so that font is 404 not found.
AS the URL in the @font-face is wrong.
With your site name redacted here is the Gochi fonts URL:

https://yourwebsitename.com/wp-content/uploads/2024/fonts/gochi-hand-v23-latin-regular.woff2

and here is the Commission font URL Which is working.

https://yourwebsitename.com/wp-content/uploads/2024/04/commissioner-v20-latin-regular.woff2

You can see the folder structure is different ie. /fonts/ vs /04/

Making that change to the Gochi font works:

https://yourwebsitename.com/wp-content/uploads/2024/04/gochi-hand-v23-latin-regular.woff2
somethingoffreedom
May 1, 2024 at 12:58 am

Thanks for the help! I have tried making that change but I still seem to be having the same issue with the Gochi font not working. I’ve had a play around and can’t seem to figure out why if you are please able to take a look?

Thanks!

David

May 1, 2024 at 5:24 am

In your CSS , look for:


/* gochi-hand-regular - latin */
    @font-face {
        font-display: swap;
        /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
        font-family: 'Gochi Hand';
        font-style: normal;
        font-weight: 400;
        src: url('https://staging.somethingoffreedom.com/wp-content/uploads/2024/04/gochi-hand-v23-latin-regular.woff2gochi-hand-v23-latin-regular.woff2') format('woff2');
        /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
    }

And delete it.

And in its place add this:


/* gochi-hand-regular - latin */
@font-face {
    font-display: swap;
    /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Gochi Hand';
    font-style: normal;
    font-weight: 400;
    src: url('https://staging.somethingoffreedom.com/wp-content/uploads/2024/04/gochi-hand-v23-latin-regular.woff2') format('woff2');
    /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

Then clear any caches on the site including WP Rocket.

Viewing 14 posts - 1 through 14 (of 14 total)

You must be logged in to reply to this topic.

Are you a GenerateCustomer?

Just browsing?

Local font failing to upload