422 posts Keep Walking
  • Has been part of the Envato Community for over 3 years
  • Elite Author: Sold more than $75,000 on Envato Market
  • Has sold $125,000+ on Envato Market
  • Has collected 100+ items on Envato Market
+2 more
UXbarn says

Hi guys!

I’m going to load Google Fonts array into every typo select box in theme options. Just curious about how to update the fonts array automatically in a period of time when there is any new font available?

Is it possible in term of automating this? or what’s your suggestion of the proper way?

Thanks in advance for your help. :)

380 posts
  • Has sold $40,000+ on Envato Market
  • Has been a beta tester for an Envato feature
  • Has been part of the Envato Community for over 4 years
  • Sells items exclusively on Envato Market
+2 more
kaaz says
1148 posts
  • Has referred 1+ members
  • Has sold $1,000+ on Envato Market
  • Has been a beta tester for an Envato feature
  • Has collected 10+ items on Envato Market
+3 more
fillerspace says

They have an API :

https://developers.google.com/webfonts/

The problem is that you need an API key, and you can’t expect everyone who buys your theme to get an API key. A workaround is to use the API yourself to grab the JSON array (once a week should be enough). You can then store the JSON on Amazon S3 for your users

393 posts
  • Located in United States
  • Power Elite Author: Sold more than $1M on Envato Market
  • Has sold $1M+ on Envato Market and is now a Power Elite Author
  • Made it to the Authors' Hall of Fame
+4 more
WPExplorer says

You shouldn’t be loading every Google Font imaginable into your themes option panel.

438 posts
  • Has been part of the Envato Community for over 2 years
  • Has sold $5,000+ on Envato Market
  • Has collected 50+ items on Envato Market
  • Located in Europe
+1 more
Pixelous says

WPExplorer, ofcourse not, he need to load an array of Google Fonts.

415 posts
  • Has referred 10+ members
  • Has sold $250,000+ on Envato Market
  • Has collected 10+ items on Envato Market
  • Elite Author: Sold more than $75,000 on Envato Market
+5 more
unisphere says

Here’s the solution I’m using on one of my themes.

Create a php file on your server and paste the following code with your own API Key:

<?php
$apikey = 'XXXXXX'
$cachefile = 'fonts.json';
$cachetime = 60 * 60;
// Serve from the cache if it is younger than $cachetime
if (file_exists($cachefile) && time() - $cachetime < filemtime($cachefile)) {
    include($cachefile);
    exit;
}
ob_start(); // Start the output buffer

/* The code to get the google web fonts list goes here */
$ch = curl_init('https://www.googleapis.com/webfonts/v1/webfonts?key=' . $apikey);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
curl_setopt($ch, CURLOPT_HEADER, 0);
curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false);
$content = curl_exec($ch);
echo $content;
curl_close($ch);

// Cache the output to a file
$fp = fopen($cachefile, 'w');
fwrite($fp, ob_get_contents());
fclose($fp);
ob_end_flush(); // Send the output to the browser
?>

This will output the Google Web Fonts list in JSON format and will cache the requests for 1 hour so that the API doesn’t reach the access limit (make sure that the script can write as it creates a file called fonts.json that actually contains the font list as cache).

In your themes you can make an HTTP request to this remote file on your server and filter any fonts you want since this list contains ALL fonts available (this script guarantees that the font list is up to date).

Hope this helps, have fun :D

415 posts
  • Has referred 10+ members
  • Has sold $250,000+ on Envato Market
  • Has collected 10+ items on Envato Market
  • Elite Author: Sold more than $75,000 on Envato Market
+5 more
unisphere says

Forgot to say that when your theme accesses this remote file on your server it should cache the results (using transients for example) so that hundreds of your client’s themes don’t hammer your server.

393 posts
  • Located in United States
  • Power Elite Author: Sold more than $1M on Envato Market
  • Has sold $1M+ on Envato Market and is now a Power Elite Author
  • Made it to the Authors' Hall of Fame
+4 more
WPExplorer says

WPExplorer, ofcourse not, he need to load an array of Google Fonts.

No I mean. You should add all those font options into the theme panel, period.

1148 posts
  • Has referred 1+ members
  • Has sold $1,000+ on Envato Market
  • Has been a beta tester for an Envato feature
  • Has collected 10+ items on Envato Market
+3 more
fillerspace says

Here’s the solution I’m using on one of my themes.
Shorter version:
$apikey = 'XXXXXX'
$cachefile = 'fonts.json';
$cachetime = 60 * 60;
// Serve from the cache if it is younger than $cachetime
if (file_exists($cachefile) && time() - $cachetime < filemtime($cachefile)) {
    include($cachefile);
    exit;
}
$content = file_get_contents('https://www.googleapis.com/webfonts/v1/webfonts?key=' . $apikey);
file_put_contents($cachefile,$content);
422 posts Keep Walking
  • Has been part of the Envato Community for over 3 years
  • Elite Author: Sold more than $75,000 on Envato Market
  • Has sold $125,000+ on Envato Market
  • Has collected 100+ items on Envato Market
+2 more
UXbarn says

Thanks so much everyone! Also, the solution @unisphere suggested is just awesome! :D

I’m going to try it out. ;)

by
by
by
by
by
by