Tagged: 

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

    Hi Kriesi
    I would like to add a new Google Font as an option for my headings in advanced styling.
    Now i go to Google fonts and i wish to add Roboto Slab.
    The Javascript they give me is

    <script type="text/javascript">
      WebFontConfig = {
        google: { families: [ 'Roboto+Slab::latin' ] }
      };
      (function() {
        var wf = document.createElement('script');
        wf.src = 'https://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
        wf.type = 'text/javascript';
        wf.async = 'true';
        var s = document.getElementsByTagName('script')[0];
        s.parentNode.insertBefore(wf, s);
      })(); </script>

    How should i use this in my child theme’s functions.php ?
    is the below correct, and which name do i use, where does Google show the name of the font and how you have to
    type it, is it “Roboto Slab or Roboto+Slab” .

    //Google Fonts
    
    add_filter( 'avf_google_heading_font', 'avia_add_heading_font');
    function avia_add_heading_font($fonts)
    {
    $fonts['Roboto+Slab'] = 'Roboto+Slab :400,700';
    $fonts['Roboto+Slab'] = 'Roboto+Slab :400,700,400italic,700italic';
    return $fonts;
    }
    
    add_filter( 'avf_google_content_font', 'avia_add_content_font');
    function avia_add_content_font($fonts)
    {
    
    $fonts['Source Sans Pro'] = 'Source Sans Pro:400,700';
    $fonts['Source Sans Pro'] = 'Source Sans Pro:400,700,400italic,700italic';
    return $fonts;
    }

    and another question is if i want the font to be bolder like 400,500,700 weight should i add tha as well and how?

    Google font Roboto Slab

    Thanks a mill for your time

    • This topic was modified 7 years, 10 months ago by waveshaper.
    #630455

    Hey indieweb,

    Did you try following this tutorial? http://kriesi.at/documentation/enfold/register-additional-google-fonts-for-theme-options/

    Best regards,
    Rikard

    #630563

    Hi Rikard
    Yes, thank you, it works.
    what i want to know is if i add numerous Google fonts should the code be like the following:

    //Google Fonts
    
    add_filter( 'avf_google_heading_font', 'avia_add_heading_font');
    function avia_add_heading_font($fonts)
    {
    $fonts['Roboto Slab'] = 'Roboto Slab:400,700';
    $fonts['Roboto Slab'] = 'Roboto Slab:400,700,400italic,700italic';
    return $fonts;
    }
    
    add_filter( 'avf_google_content_font', 'avia_add_content_font');
    function avia_add_content_font($fonts)
    {
    $fonts['Roboto Slab'] = 'Roboto Slab:400,700';
    $fonts['Roboto Slab'] = 'Roboto Slab:400,700,400italic,700italic';
    return $fonts;
    }
    
    add_filter( 'avf_google_heading_font', 'avia_add_heading_font');
    function avia_add_heading_font($fonts)
    {
    $fonts['Oswald'] = 'Oswald:400,700';
    $fonts['Oswald'] = 'Oswald:400,700,400italic,700italic';
    return $fonts;
    }
    
    add_filter( 'avf_google_content_font', 'avia_add_content_font');
    function avia_add_content_font($fonts)
    {
    $fonts['Oswald'] = 'Oswald:400,700';
    $fonts['Oswald'] = 'Oswald:400,700,400italic,700italic';
    return $fonts;
    }
    
    add_filter( 'avf_google_heading_font', 'avia_add_heading_font');
    function avia_add_heading_font($fonts)
    {
    $fonts['Roboto Condensed'] = 'Roboto Condensed:400,700';
    $fonts['Roboto Condensed'] = 'Roboto Condensed:400,700,400italic,700italic';
    return $fonts;
    }
    
    add_filter( 'avf_google_content_font', 'avia_add_content_font');
    function avia_add_content_font($fonts)
    {
    $fonts['Roboto Condensed'] = 'Roboto Condensed:400,700';
    $fonts['Roboto Condensed'] = 'Roboto Condensed:400,700,400italic,700italic';
    return $fonts;
    }
    

    Is that the correct way?
    Thanks a mill, just need some clarity on this

    #631130

    Hi,

    I can’t see any obvious problems with the code except you seem to have some duplicate code, like for instance:

    $fonts['Roboto Condensed'] = 'Roboto Condensed:400,700';
    $fonts['Roboto Condensed'] = 'Roboto Condensed:400,700,400italic,700italic';
    

    I think you can remove the first line completely since your importing the same font on the second line as well.

    Regards,
    Rikard

    #631239

    Hi Rikard
    Thank you so much for your input, that clears it up for me.
    Excellent support.
    Cheers

    #631794

    Hi,

    Glad we could help :-)

    Thanks,
    Rikard

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