This topic is: resolved

How can i insert a font

  • TanjaS
    Participant
    Post count: 14
    # 2 months, 2 weeks ago

    Hello, how can i insert Athonite.ttf font into my website?

    Please find the font attached

    Thank you!

    AuthorAuthor
    Keymaster
    Post count: 26584
    # 2 months, 2 weeks ago

    Hi there

    You need to create a webfont kit for this font using https://www.fontsquirrel.com/tools/webfont-generator and then add that custom style/css at Theme Options > Custom CSS/JS
    You will also need to change the path to font files to the absolute URLs using your website address. You can upload the kit font files to your website server through FTP or through WordPress media and use those links in the custom style sheet generated.

    Thanks

    TanjaS
    Participant
    Post count: 14
    # 2 months, 2 weeks ago

    Step 1. done
    You need to create a webfont kit for this font using https://www.fontsquirrel.com/tools/webfont-generator

    Step2 . done

    add that custom style/css at Theme Options > Custom CSS/JS

    Step 3. not sure what to do… PLease advise 🙁

    You will also need to change the path to font files to the absolute URLs using your website address.

    Step4 . done
    You can upload the kit font files to your website server through FTP

    But i can’t see the Fonts from Theme Options- Typography.

    Thank you

    AuthorAuthor
    Keymaster
    Post count: 26584
    # 2 months, 1 week ago

    Once you upload the font files to your website using FTP or media you should be able to get the URL for each file needs to be added in the custom font css got in through the kit generator.

    These custom font families added this way won’t be visible in the typography font family select boxes as it displays only Google Fonts. Custom font family needs to be used by custom css like:

    Thanks

    TanjaS
    Participant
    Post count: 14
    # 2 months, 1 week ago
    This reply has been marked as private.
    AuthorAuthor
    Keymaster
    Post count: 26584
    # 2 months, 1 week ago

    Are you sure about the location of the font files as I can not access any of these files from my browser Example: https://www.agioi-pantes.gr/themes/NativeChurch/css/fonts/athonite-webfont.woff2 All shows 404 error. If the location is correct then make sure the file permission is set to make the files accessible. Once you can access these font files using your browser then you can use this font family in any of your class. For example if you want to use this font family for your website body text then you can add custom css:

    Thanks

    TanjaS
    Participant
    Post count: 14
    # 2 months, 1 week ago
    This reply has been marked as private.
    AuthorAuthor
    Keymaster
    Post count: 26584
    # 2 months, 1 week ago

    Firstly remove the “/” from the first URL after the .eot

    You can use custom css like:

    Thanks

    TanjaS
    Participant
    Post count: 14
    # 2 months, 1 week ago

    Thank you very much!!!!

    AuthorAuthor
    Keymaster
    Post count: 26584
    # 2 months, 1 week ago

    Welcome 🙂

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

The topic ‘How can i insert a font’ is closed to new replies.