I have a problem when using yojo.ttf font. Here is my simple html code
<html>
<head>
<style>
@font-face {
font-family: 'yojo';
src: url('./yojo.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
</style>
</head>
<body>
<p style="font-family: 'yojo'">ありがとう</p>
</body>
</html>
yojo.ttf
This font works well on Safari, but it doesn't work on chrome and firefox: the font of the text in the paragraph is not yojo font family, and the console just show a warning message:
Failed to decode downloaded font OTS parsing error: post: Failed to parse table
Is there any way to fix the problem without modifying the font file? Thanks!
I know this is a bit old, and you probably already figured it out, but just in case you didn't or someone has the same issue...
Had the same problem, and basically it seems Chrome and other browsers can't read the .ttf font format. Here's how I fixed it:
Convert your .ttf file into other font formats like .eot and .woff formats.
You can do that by going to this site...
https://transfonter.org/
Upload your font, then select all the formats you need (I selected everything), and I think you can leave everything else at the default setting.
Then hit the download button. You'll get a compressed file with all the font file formats and a css stylesheet that gives you an example of how your @font-face declaration should look like. You can copy this to your css file, or just make your own declaration. Of course you should also place the font files where you want your site to access them from.
And now it should work for Chrome, Safari, and Firefox. Not sure about other browsers though!
I hope that helps you or someone.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With