403 posts Keep Walking
  • Has been a member for 3-4 years
  • Elite Author
  • Sold between 100 000 and 250 000 dollars
  • Bought between 100 and 499 items
  • Referred between 100 and 199 users
  • Exclusive Author
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. :)

369 posts
  • Envato Studio (Microlancer) Beta Tester
  • Sold between 10 000 and 50 000 dollars
  • Most Wanted Bounty Winner
  • Bought between 10 and 49 items
  • Exclusive Author
  • Has been a member for 3-4 years
kaaz says
1148 posts
  • Referred between 1 and 9 users
  • Sold between 1 000 and 5 000 dollars
  • Has been a member for 4-5 years
  • Bought between 10 and 49 items
  • Exclusive Author
  • Envato Studio (Microlancer) Beta Tester
  • United States
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

386 posts
  • Elite Author
  • Sold between 250 000 and 1 000 000 dollars
  • Referred more than 2000 users
  • Bought between 500 and 999 items
  • Has been a member for 4-5 years
  • Exclusive Author
  • United States
WPExplorer says

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

439 posts
  • Bought between 50 and 99 items
  • Europe
  • Exclusive Author
  • Has been a member for 2-3 years
  • Sold between 5 000 and 10 000 dollars
Pixelous says

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

415 posts
  • Elite Author
  • Sold between 250 000 and 1 000 000 dollars
  • Has been a member for 5-6 years
  • Exclusive Author
  • Grew a moustache for the Envato Movember competition
  • Bought between 10 and 49 items
  • Referred between 10 and 49 users
  • Portugal
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
  • Elite Author
  • Sold between 250 000 and 1 000 000 dollars
  • Has been a member for 5-6 years
  • Exclusive Author
  • Grew a moustache for the Envato Movember competition
  • Bought between 10 and 49 items
  • Referred between 10 and 49 users
  • Portugal
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.

386 posts
  • Elite Author
  • Sold between 250 000 and 1 000 000 dollars
  • Referred more than 2000 users
  • Bought between 500 and 999 items
  • Has been a member for 4-5 years
  • Exclusive Author
  • United States
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
  • Referred between 1 and 9 users
  • Sold between 1 000 and 5 000 dollars
  • Has been a member for 4-5 years
  • Bought between 10 and 49 items
  • Exclusive Author
  • Envato Studio (Microlancer) Beta Tester
  • United States
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);
403 posts Keep Walking
  • Has been a member for 3-4 years
  • Elite Author
  • Sold between 100 000 and 250 000 dollars
  • Bought between 100 and 499 items
  • Referred between 100 and 199 users
  • Exclusive Author
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