下面是一些用于填充Google Font API下拉列表的快速初稿代码,我不知道选项框架,所以这不会解决这个问题。
1. Get an API Access Key from Google
您的请求将需要有效密钥,您可以按照此处的说明获取密钥:
https://developers.google.com/webfonts/docs/developer_api每天#对特定请求是免费的,您还可以获得一些很酷的使用统计数据。
2. Let\'s use WordPress\'s HTTP API to get the JSON response
//enter your api key and the Google Font url
$google_api_url =
\'https://www.googleapis.com/webfonts/v1/webfonts?key=AIzaSyD6j7CsUT89645jlhkdBjnN-5nuuFGU\';
//lets fetch it
$response = wp_remote_retrieve_body( wp_remote_get($google_api_url, array(\'sslverify\' => false )));
注意事项
\'sslverify\' => false
, 这是因为Google需要SSL来授权API密钥,您可以删除它,这可能会起作用,但如果您遇到SSL验证错误(尤其是在localhost上),您可以尝试将其设置为false。
3. Loop through the response
现在我们有了一些可以处理的东西,所以让我们检查错误并循环使用Google返回的数据。
if( is_wp_error( $response ) ) {
echo \'Something went wrong!\';
} else {
// Let\'s turn the JSON response into something easier to work with
// I guess this part is what really answers the above in terms of WP
// working with json responses, if anyone knows any better way, do tell
$json_fonts = json_decode($response, true);
// that\'s it
$items = $json_fonts[\'items\'];
$i = 0;
foreach ($items as $item) {
$i++;
$str = $item[\'family\']; //I guess we want the font family
上面只是返回字体系列,但是还有更多的数据通过Googsy返回,例如字体权重选择和一系列字体子集,为了保持此示例的简单性,我省略了这些数据。此外,您可能应该使用javascript而不是PHP,但我们不需要处理这个问题(您可以排队
wp-includes/js/json2.js
).
4. Output
现在,我们有了一个通过以下方式循环输出的字体列表
$str
, 您可以使用以下内容将它们添加到输入框中
<option value="<?php echo $str; ?>"><?php echo $str; ?></option>;
, 是的,这有点像犹太人区,但看起来像:
您可能希望将该信息放在选项框架字段或其他内容中。
5. Now we need to actually get the font we select
由于我们将输入值设置为字体名称,这或多或少是Googsy想要的,好吧,上面我消除字体子集和权重的部分将导致一些问题,因此您需要扩展该循环以包含您想要的数据!
现在我们通过下拉选择获取输入并将其附加到CSS Google API url,如下所示http://fonts.googleapis.com/css?family= ..your font name +stuff ....
例如:http://fonts.googleapis.com/css?family=Anonymous+Pro
这里有很多我没有提到的事情,比如使用Transients_API 因为谷歌经常更新字体集合,我们不需要为了相同的信息不断地攻击他们。
还使用一些内置函数,如wp_list_pluck 从列表中选择字体。
另外,我没有完成第5部分的代码,因为我饿了,所以希望这能让你走上正轨。