[Resolved] Adding custom font via FTP Child theme

Home Forums Support Adding custom font via FTP Child theme

This topic contains 5 replies, has 2 voices, and was last updated by  David 1 month ago.

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
  • #1258933


    Hi again guys,

    I have read your instructions on this link https://docs.generatepress.com/article/adding-local-fonts/#uploading-our-font and I have followed some threads on this forum, but once I get to the bit about making this work, the trail seems to go cold.

    I simply want to add the Google font Saira_Semi_Condensed. I have downloaded it and I have created a folder in my Child theme called ‘Fonts’. I then uploaded the Saira_Semi_Condensed file to FTP via CPanel File Manager.
    According to the instructions on the above link, that should be it and I quote “Note: If you’re comfortable with uploading files to your server via FTP, you can skip this step and simply upload your font files to your child theme”.

    This did not work, so I have read your forum and found that there seems to be some code I need to add to Additional CSS in Customiser.

    I have tried several different methods to add the codes described on you forum and https://css-tricks.com/snippets/css/using-font-face/, but nothing is working.

    The Font files I have only has .ttf files, so all these WOFF and WOFF2 files appear to be irrelevant. So I have tried to add this code;

    @font-face {
    font-family: ‘SairaSemiCondensed’;
    src: url(‘https://bosstorage.com.au/wp-content/themes/generatepress_child/fonts/SairaSemiCondensed.ttf’) format(‘truetype’), /* Safari, Android, iOS */

    Please can you explain what I am getting wrong.
    Thanks in advance.


    David Customer Support

    Hi there,

    you need to continue from here:


    Let us know how you get on 🙂



    Hey David,
    OK, so I have done all of this. I have added the following CSS from the Google Webfonts Helper to the Child Theme Stylesheet;

    /* saira-semi-condensed-regular – latin */
    @font-face {
    font-family: ‘Saira Semi Condensed’;
    font-style: normal;
    font-weight: 400;
    src: url(‘https://www.bosstorage.com.au/wp-content/themes/generatepress-child/fonts/saira-semi-condensed-v5-latin-regular.eot’); /* IE9 Compat Modes */
    src: local(‘Saira SemiCondensed Regular’), local(‘SairaSemiCondensed-Regular’),
    url(‘https://www.bosstorage.com.au/wp-content/themes/generatepress-child/fonts/saira-semi-condensed-v5-latin-regular.eot?#iefix’) format(’embedded-opentype’), /* IE6-IE8 */
    url(‘https://www.bosstorage.com.au/wp-content/themes/generatepress-child/fonts/saira-semi-condensed-v5-latin-regular.woff2’) format(‘woff2’), /* Super Modern Browsers */
    url(‘https://www.bosstorage.com.au/wp-content/themes/generatepress-child/fonts/saira-semi-condensed-v5-latin-regular.woff’) format(‘woff’), /* Modern Browsers */
    url(‘https://www.bosstorage.com.au/wp-content/themes/generatepress-child/fonts/saira-semi-condensed-v5-latin-regular.ttf’) format(‘truetype’), /* Safari, Android, iOS */
    url(‘https://www.bosstorage.com.au/wp-content/themes/generatepress-child/fonts/saira-semi-condensed-v5-latin-regular.svg#SairaSemiCondensed’) format(‘svg’); /* Legacy iOS */

    I then added this to the Customiser Additional CSS;

    add_filter( ‘generate_typography_default_fonts’, function( $fonts ) {
    $fonts[] = ‘Saira Semi Condensed’;

    return $fonts;
    } );

    In the Child Theme Fonts folder within CPanel File Manager, I have now added every conceivable file associated with the Saira Semi Condensed font from the Google webfont helper download to the Google Fonts Download.

    Still I do not see the font?


    David Customer Support

    The add_filter code is PHP.
    This needs to be added to your child themes functions.php




    That was it David, you’re a legend.
    All working now.


    David Customer Support
Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.