Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • June 20, 2019 at 5:28 pm #1112004
    bauchope

    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

    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

    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

    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

    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

    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.