Web font loading?

  • Resolved bst7

    (@bst7)


    4 years, 8 months ago

    I use customise 2017 plugin to set the fonts I am using on my website. Looking at my site with google page load, I get this error: “Ensure text remains visible during webfont load”

    Having a bit of a look through the plugin’s code, it doesn’t seem it is setting a “font-display: swap;” on the fontface (if that is indeed the right fix).

    Is this something that can be addressed by the plugin, or with customised CSS?

    Thanks

    The page I need help with: [log in to see the link]

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Author boldthemes

    (@boldthemes)

    4 years, 8 months ago

    Hi @bst7

    Thanks for using our plugin.

    Please check bt_customize_2017.php plugin file and 272-289 lines, and change them according to your needs.

    echo ‘<style>’;
    if ( isset( $theme_options[ ‘body_font’ ] ) && $theme_options[ ‘body_font’ ] != ” ) {
    echo ‘body, button, input, select, textarea { font-family: “‘ . urldecode( $theme_options[ ‘body_font’ ] ) . ‘” } ‘;
    echo ‘input::-webkit-input-placeholder { font-family: “‘ . urldecode( $theme_options[ ‘body_font’ ] ) . ‘”; } ‘;
    echo ‘input::-moz-placeholder { font-family: “‘ . urldecode( $theme_options[ ‘body_font’ ] ) . ‘”; }’;
    echo ‘input:-ms-input-placeholder { font-family: “‘ . urldecode( $theme_options[ ‘body_font’ ] ) . ‘”; } ‘;
    echo ‘input::placeholder { font-family: “‘ . urldecode( $theme_options[ ‘body_font’ ] ) . ‘”; } ‘;
    }
    if ( isset( $theme_options[ ‘title_font’ ] ) && $theme_options[ ‘title_font’ ] != ” ) {
    echo ‘.site-description, .entry-header h2.entry-title { font-family: “‘ . urldecode( $theme_options[ ‘title_font’ ] ) . ‘”; } ‘;
    }
    if ( isset( $theme_options[ ‘heading_font’ ] ) && $theme_options[ ‘heading_font’ ] != ” ) {
    echo ‘h1, h2, h3, h4, h5, h6, p.site-title { font-family: “‘ . urldecode( $theme_options[ ‘heading_font’ ] ) . ‘” } ‘;
    }
    if ( isset( $theme_options[ ‘menu_font’ ] ) && $theme_options[ ‘menu_font’ ] != ” ) {
    echo ‘.main-navigation .menu { font-family: “‘ . urldecode( $theme_options[ ‘menu_font’ ] ) . ‘”; } ‘;
    }
    echo ‘</style>’;

    Thread Starter bst7

    (@bst7)

    4 years, 8 months ago

    I did try inserting this, but must have done something wrong – as once I did that, the font never actually displayed in Roboto, but stayed with Arial (I guess). So, I thought I must have added that line in the wrong place…

    To take one of the lines above, would this be correct:
    echo ‘input::-moz-placeholder { font-display: swap; font-family: “‘ . urldecode( $theme_options[ ‘body_font’ ] ) . ‘”; }’;

    or should it be at the end:
    echo ‘input::-moz-placeholder { font-family: “‘ . urldecode( $theme_options[ ‘body_font’ ] ) . ‘”; font-display: swap; }’;

    Sorry – I’m sort of hacking around here as you can tell!

    William

    Thread Starter bst7

    (@bst7)

    4 years, 8 months ago

    Please disregard the previous comment, I’ve understood better what you were referring to.

    Plugin Author boldthemes

    (@boldthemes)

    4 years, 8 months ago

    Hi William,

    Thanks for the info. Cheers 🙂

Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘Web font loading?’ is closed to new replies.