Site logo

[Resolved] OFT Font Problems

Home Forums Support [Resolved] OFT Font Problems

Home Forums Support OFT Font Problems

Viewing 15 posts - 1 through 15 (of 15 total)
  • Author
    Posts
  • #2437528
    Paul

    Hi There,

    I wanting to add some a local font – I followed the instructions in the docs but not working for me. Any ideas on what I’m doing wrong?
    Please see detail in private info.

    Cheers
    Paul

    #2437790
    Ying
    Staff
    Customer Support

    Hi there,

    Our document for adding local fonts doesn’t include this PHP snippet anymore, as we’ve introduced the dynamic typography system to GP.

    Please make sure you are following this documentation: https://docs.generatepress.com/article/adding-local-fonts/
    The video should show it pretty straightforward.

    Just checked your CSS, the URLs lead to the 404 page, they are not correct.

    #2438666
    Paul

    Thanks for info Ying – I fixed the issue with URLs and followed the video – although still can’t see the font in the customiser – any ideas on what I’ve done wrong?

    #2438876
    David
    Staff
    Customer Support

    Hi there,

    in Customizer > Typography -> Font Manager -> Add New Font.
    In the field provided paste in your font-family name as it is in your @font-face eg. HelveticaNowText
    DO NOT set it to use the Google Font API.

    Now when you Add Typography, you will be able to select your custom font.

    #2438993
    Paul

    Hi David,

    I’d already done that I can see the font in the drop-down but doesn’t update the font.
    Would you like admin access so you can view?

    Cheers
    Paul

    #2439289
    David
    Staff
    Customer Support

    Try converting the OTF fonts to .woff and .woff 2 files. As my browsers are refusing to load those OTF fonts.
    The Font Squirrel site has a generator that can do that for you.

    #2439316
    Paul

    Thanks David I’ll give it a try!

    #2439437
    David
    Staff
    Customer Support

    Let us know how you get on!

    #2441942
    Paul

    Hi David,

    I converted to .woff and uploaded via FTP and updated the CSS then updated customiser settings but still not working?

    Any ideas?

    CSS in private info.
    Do I need to update this line?
    src: local(”),

    Cheers

    #2441995
    Ying
    Staff
    Customer Support

    I’m not seeing the @font-face CSS for Helvetica Now Text on your site, but I do see @font-face CSS for Robotofont.
    How did you add it?

    #2442490
    Paul

    Hi Ying,

    Thanks for looking into it. I added the CSS via the child theme (see attached screengrab) but doesn’t show in the code – any idea why?

    As a test I added the below the CSS to the ‘Additional CSS’ in the customiser and now seeing in source BUT font still not displaying (gah!)

    Do you know what I’m doing wrong?

    Thanks

    #2442539
    Paul

    Morning David,

    Any chance you could help with this one?

    Cheers
    Paul

    #2442615
    David
    Staff
    Customer Support

    Almost there –

    change your @font-face to:

    
    @font-face {
            font-family: 'HelveticaNowText';
            font-style: normal;
            font-weight: 400;
            src: local(''), url('https://the-zag-v6.instawp.xyz/wp-content/themes/Paul-Kelsall-Starter-Theme/fonts/helveticanowtext-regular-webfont.woff2') format('woff2'), /* Super Modern Browsers */
            url('https://the-zag-v6.instawp.xyz/wp-content/themes/Paul-Kelsall-Starter-Theme/fonts/helveticanowtext-regular-webfont.woff') format('woff'), /* Pretty Modern Browsers */
            url('https://the-zag-v6.instawp.xyz/wp-content/themes/Paul-Kelsall-Starter-Theme/fonts/helveticanowtext-bold-webfont.woff2') format('woff2'), /* Super Modern Browsers */
            url('https://the-zag-v6.instawp.xyz/wp-content/themes/Paul-Kelsall-Starter-Theme/fonts/helveticanowtext-bold-webfont.woff') format('woff'), /* Pretty Modern Browsers */
            url('https://the-zag-v6.instawp.xyz/wp-content/themes/Paul-Kelsall-Starter-Theme/fonts/helveticanowtext-regita-webfont.woff2') format('woff2'), /* Super Modern Browsers */
            url('https://the-zag-v6.instawp.xyz/wp-content/themes/Paul-Kelsall-Starter-Theme/fonts/helveticanowtext-regita-webfont.woff') format('woff'); /* Pretty Modern Browsers */
    }

    Then your font name in the Customizer should be: HelveticaNowText

    #2443045
    Paul

    Awesome David – that’s working now! Much appreciated as always!

    #2443092
    David
    Staff
    Customer Support

    Glad to hear that!

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