Google Fonts API

[pnpetroff]

When using Google Fonts, do I enter my own API key in the php file, or I must do an input field in the option panel in which everyone should paste their own API Key?

And one more question: What is the best way to generate the < links > to the Google API in the header?

[dovy]

@pe6o The Google key you are free to input. The limit is like 20k an hour and it only happens once. Right now you're find to just remove it, but don't worry about maxing out your Google API queries. It will never happen.

The header meaning the actual body of your front-end? I've got a function here already done. Let me clean that up a bit and I'll post it.

I am off for the day though. I'll ping you once it's ready. ;)

[dovy]

Here's a sample if you know it's a google font. I just have to set the flag now via JS...

<?
    function getGoogleScript($font) {
      $link = 'http://fonts.googleapis.com/css?family='.str_replace(" ","+",$font['family']);
      if (!empty($font['style']))
        $link .= ':'.str_replace('-','',$font['style']);
      if (!empty($font['script']))
        $link .= '&subset='.$font['script'];

      return '<link href="'.$link.'" rel="stylesheet" type="text/css" class="base_font">';
    }

[dovy]

Ok, so I went ahead and fixed it for you. Here's what you'd have to do.

<?
    function getGoogleScript($font) {
        if (empty($font)) {
            return;
        }
      $link = 'http://fonts.googleapis.com/css?family='.str_replace(" ","+",$font['family']);
      if (!empty($font['style']))
        $link .= ':'.str_replace('-','',$font['style']);
      if (!empty($font['script']))
        $link .= '&subset='.$font['script'];

      return '<link href="'.$link.'" rel="stylesheet" type="text/css" class="base_font">';
    }

You'll run this for each typography field you have. That will return to you the proper style. You could even enqueue it if you prefer.

You'll still have to set all your other CSS like you would normally, but that's how you do it. ;)

[dovy]

P.S. Update to the new version of Simple Options for the fix.

[pnpetroff]

@dovy Whoa, thanks for the explanation. I'll try it!

Does this resolve situations like the font "Open Sans Condensed" where the link is http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300 and it doesn't work without the '300' as I have pointed in the SMOF thread?

[dovy]

Yup! Give it a try. Style sizes will only work if the font supports it. ;)

300 won't be visible if the font doesn't allow it.