Custom Fonts not Showing in IOS

1

Hi Sorry if someone has already started this thread. I am using Open Sans and a custom icon font that I made. They both work fine on the desktop browser. However, when I preview on an IOS device the fonts don’t load. I just get the default font (times roman or something). I have seen this issue on other sites (not created with Hype) with other fonts while using my Ipad and I have always wondered why the fonts aren’t loading. Does anyone know an easy fix for this issue. My fonts must be missing something.

2

Using the search function top left I landed on this: Using local fonts
Scroll down for DBear’s answer.

2 Likes
3

Thanks

4

My fonts are loading in the desktop browser they just don’t seem to be working on my iphone and ipad. Was hoping someone had a fix for this but I don’t see one.

5

The most common cause is that the fonts do not exist on the other devices. Are you including your fonts in the Resources Library and adding @font-face code that references those files in Hype’s Custom CSS Font panel?

http://tumult.com/hype/documentation/3.0/#declaring-an-font-face-style

6

Yes, I have tried everything. I was hoping that someone out there might come across this issue. The thing is I don’t think it’s Hype. I have noticed this on other sites even CBS. The crazy thing is that it only seems to be happening on the iPad.

7

Same problem. I included the font the way it is recommended in the documentation.
It shows in my browser. Any browser -Opera,Firefox,Chrome,Safari -
But, when it’s uploaded to a different server, it shows Times.

I solved it by using the font as a picture. But this cannot be the solution.
Especially, when I have more Text.

But the real reason is, that the files exported from HYPE as a HTML-Folder have a much smaller data weight.
And most websites presenting HTML5-Ads are allowing not more than 200K max. 400K.
This is a real pain…

So, if anyone has a solution for this… I appreciate :slight_smile:

btw. If I export this little animation as a GIF - it has 4.something MBs. This is way to much!

Thomas.

8

Hi Thomas,

I figured it had to be my device are using X code to check if the font was working. Turns out it was my ad blocker. Once I turned it off the font loaded. Doesn’t make sense but it worked.

1 Like
9

Hi Les,

I will post a solution tomorrow. After my project is tested properly. I’ll provide a codesnippet how to make the CSS as well. When it’s working :sunglasses:

Thomas