Local font is displayed incorrectly online

I have embedded a local font via BLOCS, which I also loaded onto the server in the formats .woff and .woff2. I had to manually move the .ttf format into the folder on the server.
When I now look at it on Safari, everything looks wonderful. But as soon as I choose other browsers - Firefox, GoogleChome or Opera - the font is not displayed correctly. Where is the error? The address is https://praxis-arnold-pflugfelder.de/test
Thanks for help, Andreas

That doesn’t sound right. You shouldn’t have needed to manually move the .ttf file to the server. In this instance I would start by removing the font from your project and adding it again. You need to add a folder containing a .ttf, .woff and .woof2. Blocs should sort out the rest.

Hi Flashman, thank you for your answer.
I just tried to remove the font via Font Manager. After that I closed BLOCS and reopened it.
I installed the fonts via Font Manager and then two dialogue windows opened. The first said the fonts are now installed, the second said the font is already installed.
At the very beginning I already had a folder that did not contain the .ttf version. But BLOCS seems to have remembered that and won’t let go of it. When I export the project, the .ttf version is always missing from the font folder.
How else can I remove the existing local fonts? Do I have to delete all formatting as well? Or do the font files all have to go to the top level in the “fonts” folder after the export?

Something is obviously not right here. I would start by quitting Blocs, then go to the Application Support folder in your user library. You will find a folder for Blocs 4 and inside that a separate folder for fonts. Look for the font that is causing you problems and delete it manually.

Afterwards you can start Blocs and it will likely say that the font is missing, which is what we want. Now add it again and see how it goes. You don’t need to remove any formatting, since we are simply going remove the local fonts and add them again. If they are added properly Blocs takes care of everything.

This is a video I prepared for another user who was having difficulty adding local fonts and it may help explain how it should work.

Thank you for your attention.
I have now got the fonts completely deleted and was able to install them again after restarting BLOCS (without an error message). Strangely, there was still talk of the fonts already being installed.
The export of the page with the .ttf files only worked now when I adapted the name of the font to the setting of the other formats (.woff+2) - there the title was extended by the addition “-Latin1”. This meant that at least all font formats were exported from BLOCS.
But after the installation on the server, the problem remained that the font was not displayed correctly in Google Chrome and Firefox.
I even had the online font converter recreate the .ttf files, but that didn’t bring about any change either.
And now?

One more addition: I looked in the last style.css file of BLOCS and found the following there:

@font-face {
font-family: ‘IBMPlexSans’;
src: url(’./fonts/IBMPlexSans/IBMPlexSans-Regular-Latin3.woff2’);
src: url(’./fonts/IBMPlexSans/IBMPlexSans-Regular-Latin3.woff2’) format(‘woff2’),
url(’./fonts/IBMPlexSans/IBMPlexSans-Regular-Latin3.woff’) format(‘woff’);
font-weight: normal;
font-style: normal;
}

First of all, no .ttf file has been linked at all and then I don’t understand why the .woff2 file is linked twice.

I’m afraid I’ll have to get to grips with the formatting and test this with a completely different local font?

First question I guess it what version of Blocs and OS are you using?

I see this is a Google font. Do you by chance also have the font installed by linking to the Google CSS and not just as a local font? If so, that might be causing problems in theory.

In the past I have seen cross origin issues with font rendering that impacts Firefox and Chrome, but that shouldn’t be the case with Blocs.

You could try downloading the font again from that link above in case there is something wrong with your original file, because it looks like Blocs is not recognising your .ttf for whatever reason. If that doesn’t work I would try another font entirely to see if the same problem occurs.

I basically know that recent versions of Blocs are working well with local fonts, because I use them reliably all the time, so I figure it was either down to the way you were adding the font or maybe an issue with that particular font file. It may even have been corrupted.

I use Big Sur in the latest version and BLOCS in the latest version.
There is no link to the Google CSS.
However, I have downloaded the Google font and selected its .ttf versions. Now one of the font styles works, but another does not. It looks like something is incompatible with the original fonts.
I don’t know how you could help now - I’ll try something else and use another local font. I can post my results again.
Thank you so far!

Yes something is definitely unusual here. I think we need to test with another font for better understanding.

I have now converted the .ttf file downloaded from Google Fonts for the font that is not yet working and renamed it similarly to the woff files. Then I reinstalled the fonts in BLOCS (following your described procedure) and uploaded them to the server. And now it works!

I haven’t uploaded a completely different local font yet, but I assume that there is some irritation in the original IBM Plex font that caused this mess.

So: problem solved, but only in a roundabout way.
Thanks again for your support and hopefully the next local font will just work as it should.

I am also having the same problem - very new to this, and don’t know how to convert fonts or anything of the sorts. Also using Big Sur with the latest version of Blocs.

My font displays in English and French, but won’t in Japanese. Also looks fine in safari, but not on Chrome…

Any guidance with how to convert-delete-replace a font in blocs would be much appreciated (or a link on how to do this).

Website link if that helps: https://seflemelin.com/

Thanks!