Issue with uploaded font disappearing when SSL certificate is applied. - Support

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

Author

Posts
June 20, 2019 at 5:28 pm #1112004

bauchope
Participant

Hi,
I uploaded a font to my website during the build and now after I have put the site live the font has reverted back to standard but only on mobile. Desktop and tablet are working fine.

It was uploaded into import/export.

And has been set as font type under general styling.

Can you assist please?

Kim

June 21, 2019 at 4:33 am #1112181

Mike
Moderator

Hey bauchope,
Thanks for the login, please explain an example for where the font is not working for mobile, a text phrase would be helpful.
I didn’t see a mismatched font on mobile right off.

Best regards,
Mike

June 21, 2019 at 9:48 am #1112252

bauchope
Participant

Hello Mike, Screenshots attached. From what I can gather it seems to be an android issue only. My colleagues with iphones are seeing the correct font for the headings and text.

Pretty sure all my settings in the stylesheets are correct and can’t see an option to fix anything.

Very strange.

Android layout – http://prntscr.com/o4q9s9 (wrong font)
iphone layout – http://prntscr.com/o4qafn (correct font)

Many thanks in advance
Kim

June 22, 2019 at 4:33 am #1112471

Mike
Moderator

Hi,
Thanks for the screenshots, I see that you are using a stencil font that is in .woff format. I viewed your site with my Android and the font loaded fine. My research found that the .woff format is not recognized by Android natively, this means that typically if the user opens an email link or is redirected from an app or lands on the page from some ad redirects the built-in browser will be used to view the page, and the font won’t work. But if the user is using a mobile browser such as Chrome the font will work. I believe this is why it works for me.
Please check if this is your case, you can recognize the native browser by it’s lack of bookmarks and toolbar.

Best regards,
Mike

June 22, 2019 at 5:05 pm #1112590
Guenni007
Participant
I don’t see the page you’re referring to – but here in this code you can see in the comments what the font files are for:
```
/* allerta-stencil-regular - latin */
@font-face {
  font-family: 'Allerta Stencil';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/allerta-stencil-v9-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('Allerta Stencil Regular'), local('AllertaStencil-Regular'),
       url('../fonts/allerta-stencil-v9-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/allerta-stencil-v9-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/allerta-stencil-v9-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/allerta-stencil-v9-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/allerta-stencil-v9-latin-regular.svg#AllertaStencil') format('svg'); /* Legacy iOS */
}
```
this will be the highest compatiblitiy .
If you are only using : woff – supported devices are lower.
June 22, 2019 at 5:33 pm #1112593

Mike
Moderator

Hi,
Thanks @Guenni007 :)

Best regards,
Mike
Author

Posts

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

You must be logged in to reply to this topic.