Viewing 19 posts - 1 through 19 (of 19 total)
  • Author
    Posts
  • #929327

    Hi I’m trying to use the google font ‘Hind”, I want to use this as light as possible. There is a light (300) version of it. I have implemented it in my functions.php, see below this.

    <?php
    
    /*
    * Add your own functions here. You can also copy some of the theme functions into this file. 
    * WordPress will use those functions instead of the original functions then.
    */
    
    add_filter( 'avf_google_heading_font', 'avia_add_heading_font');
    function avia_add_heading_font($fonts)
    {
    $fonts['Hind'] = 'Hind:300,400,700';
    return $fonts;
    }
    
    add_filter( 'avf_google_content_font', 'avia_add_content_font');
    function avia_add_content_font($fonts)
    {
    
    $fonts['Hind'] = 'Hind:300,400,700';
    

    In the theme-options I’ve set the <p> and the body to light, but that doesn’t change anything. When I change the weight in dev tools, it changes to 700, but not to 300. Any suggestions? I’ve added a link to my site in the private part.

    Regards,

    Erwin

    #929340

    Hey erwin_m,

    Have you tried adding the font-weight directly within quick css?

    Best regards,
    Jordan Shannon

    #929347

    Hey,

    Thank you for the lightning fast respons!

    Just tried right now, same effect as in dev tools. No change at 300, a bolder text at 700.

    Regards,
    Erwin

    #929363

    the code above isn’t complete:

    add_filter( 'avf_google_heading_font', 'avia_add_heading_font');
    function avia_add_heading_font($fonts)
    {
    $fonts['Hind'] = 'Hind:300,400,700';
    return $fonts;
    }
    
    add_filter( 'avf_google_content_font', 'avia_add_content_font');
    function avia_add_content_font($fonts)
    {
    $fonts['Hind'] = 'Hind:300,400,700';
    return $fonts;
    }
    #929369

    Thank you for looking into it.

    Can you specify me what is missing?

    #929372

    down the second rule about content fonts:
    each of them needs the return $font

    return $fonts;
    }

    but you should know that if you like to have it only for some css rules – the font isn’t activated till you use it in enfold options dialogs.
    If you don’t want to use it as content font globaly – you can define it for example as h6 in advanced styling. this starts the activation of the font. the code above only makes it selectable in fonts choice.

    #929375

    I see, in the first part for the heading it is present, in the content-part it isn’t, also the closure tag is missing. That was a sloppy way of copying, in my functions-file they both are present.

    #929377

    read the edit above i wrote something additional

    but you should know that if you like to have it only for some css rules – the font isn’t activated till you use it in enfold options dialogs.
    If you don’t want to use it as content font globaly – you can define it for example as h6 in advanced styling. this starts the activation of the font. the code above only makes it selectable in fonts choice.

    after that you can define css rules with font-family : hind

    #929385

    That’s the way I did it. In website styling I set it as global font for body-text. Cause this didn’t work, the font-weight, the font is indeed hindi, I also set it in advanced styling for the body-text and for <p>. That is correct I think?

    #929386

    or you can activate it via : (EDIT you do not need it if you have set it as content font in enfold options )

    add_action('wp_head', function() {
    ?>
      <link href='http://fonts.googleapis.com/css?family=Hind' rel='stylesheet' type='text/css'>
    <?php
    });
    #929387

    have you a link to the site?

    #929388

    Hey Guenter,

    Thank you for the help with this!

    Best regards,
    Jordan Shannon

    #929390

    Hey Guenter,
    We’re already diving into it, but as Jordan, I’m really thankful for thinking with me.

    Here you can find the site

    #929393

    if you have here on content font hind defined as the font to use – you don’t need to determine it again in quick css !

    #929395

    and do not use the rule “lighter”
    set font-weight to 300

    body#top {
        font-weight: 300;
        font-family: 'Hind', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    }

    __________________

    Edit – here because topic is closed !

    i think there has to be something wrong.

    I do activate the hind font locally on a test page –
    the 300er font-weight is a bit thinner than the 400.

    Compare the justified text-blocks under “Leistungen” and “Scanservice”
    https://webers-testseite.de/guenterweber/

    • This reply was modified 6 years, 8 months ago by Guenni007.
    #929396

    I was trying to add an image with the font-setting, but snag-it was offline. When I was trying to reload the page I saw that the font for the body-text was set back to arial. I think I was so stupid to not save this setting, unbelievable. So stupid of me… It does work now.

    Thank you very much and I’m apologizing for taking your time.

    Regards,
    Erwin

    #929399

    Hi,

    Did you still need further help on this topic or shall we close it?

    Best regards,
    Jordan Shannon

    #929400

    You can close it.

    #929404

    Hi,

    If you need additional help, please let us know here in the forums.

    Best regards,
    Jordan Shannon

Viewing 19 posts - 1 through 19 (of 19 total)
  • The topic ‘Light version of google fonts’ is closed to new replies.