[Support request] Custom fonts not displaying on chromebook but are in chrome on other computers

Home Forums Support [Support request] Custom fonts not displaying on chromebook but are in chrome on other computers

Home Forums Support Custom fonts not displaying on chromebook but are in chrome on other computers

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #1140419
    Alex

    Hi team GP,

    I’ve got two custom fonts installed on a site build which I followed the documentation to do – they display in the editor etc etc no problem.

    As far as them displaying on the site, they do in both Chrome & Safari on desktop, tablet and mobile but when viewed on a chromebook (running chrome of course) the fallback displays and the main logo displays as broke too.

    Any help gratefully received,

    Alex

    #1140476
    David
    Staff
    Customer Support

    Hi there,

    I am seeing a bunch of 404 errors in the developers console related to fonts and images – the URLs to the fonts and images are wrong eg.

    https://yoursite.com/css/fonts/CustomFont.woff

    Need to update your @font-face CSS with the correct URL.

    I can’t see a problem with the logos output but there is an issue with your Video Poster HMTL in the header element ie.

    <source src="URL/TO/video.webm" type="video/webm">

    #1140489
    Alex

    Hi David,

    Thanks for that, looking at the CSS I have the following –

        @font-face {
      font-family: 'DrukWide-Medium';
      src:  url('http://hotline-recordings.com/wp-content/uploads/2020/01/DrukWide-Medium.woff2') format('woff2'),
            url('http://hotline-recordings.com/wp-content/uploads/2020/01/DrukWide-Medium.woff') format('woff');
    }
    
        @font-face {
      font-family: 'Space Mono';
      src:  url('http://hotline-recordings.com/wp-content/uploads/2020/01/SpaceMono-Regular.woff2') format('woff2'),
            url('http://hotline-recordings.com/wp-content/uploads/2020/01/SpaceMono-Regular.woff') format('woff');
    }

    Is that not as it should be?

    Thanks,

    Alex

    #1140491
    David
    Staff
    Customer Support

    Thats correct – maybe a caching issue but i as seeing:

    https://yoursite.com/css/fonts/CustomFont.woff

    Also seeing a bunch of HTTP warnings in the console as well….

    #1140511
    Alex

    Hi David,

    Got it I think, they were http links rather than https and I think the SSL was blocking them? Have added the ‘s’ to the end of the links and the fonts are displaying now.

    I see though that the SVG logo in the header isn’t being served for the same reason – I’ve tried to re-upload the file but it still has an http link rather than https – is there any way around that?

    thanks!

    #1140514
    Alex

    This is from the inspector –

    Mixed Content: The page at 'https://hotline-recordings.com/' was loaded over HTTPS, but requested an insecure image 'http://hotline-recordings.com/wp-content/uploads/2020/01/Hotline-header-logo-desktop.svg'. This request has been blocked; the content must be served over HTTPS.

    #1140516
    David
    Staff
    Customer Support

    That ones coming from the Sticky Nav logo – you will need to re-enable it and add/remove the logo.

    #1140520
    Alex

    Hi David, just tried that but still no joy, any ideas?

    Thanks!

Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.