Archived topic
Font not showing on other devices.
4 replies · Started by Yannick on September 28, 2022
Hello Guys,
I have downloaded a custom font and uploaded the .ttf file to my website. I have enabled the font face css rule. It appears to be working on my computer (where i have the font installed). Is it possible to display the font on devices that not have installed the font? Or is there a work around so i can still use this font and it's visible to all users?
I hope to hear form you guys!
Kind regards
Yannick
@font-face {
font-family: 'test';
src: url('http://www.milieumc.nl/wp-content/uploads/2022/09/LOVES.eot');
src: url('http://www.milieumc.nl/wp-content/uploads/2022/09/LOVES.eot?#iefix') format('embedded-opentype'),
src: url('http://www.milieumc.nl/wp-content/uploads/2022/09/LOVES-REG.woff2') format('woff2'), url('http://www.milieumc.nl/wp-content/uploads/2022/09/LOVES.woff') format('woff'),
url('http://www.milieumc.nl/wp-content/uploads/2022/09/LOVES-1.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
I have added this code to my customizer. And it looks all good, is it even possible to display a font that is not installed on the users device?
Information to check in backend
Hi there,
Replace your CSS with this:
@font-face {
font-family: 'test';
src: url('https://www.milieumc.nl/wp-content/uploads/2022/09/LOVES.eot');
src: url('https://www.milieumc.nl/wp-content/uploads/2022/09/LOVES.eot?#iefix') format('embedded-opentype'),
url('https://www.milieumc.nl/wp-content/uploads/2022/09/LOVES-REG.woff2') format('woff2'),
url('https://www.milieumc.nl/wp-content/uploads/2022/09/LOVES.woff') format('woff'),
url('https://www.milieumc.nl/wp-content/uploads/2022/09/LOVES-1.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}Again a perfect solution. Thanks a lot Ying :).
No problem :)
