wordpress-twentyfifteen主题Google字体本地化配置

在我们的网络环境下,通常情况访问Google所有服务是十分吃力的,我们在使用Wordpress这么优秀的建站程序中,国外的主题一般都有用到Google提供的公共字体库,使用新的字体能让我们的网站变得漂亮美观,但是由于网络因素导致我们的网站打开异常缓慢,从而导致页面无法正常显示。如果你不想替换Google字体库的话,那么你可以在Wordpress插件里面搜索一款名叫“Disable Google Fonts”的插件,安装好后直接启用插件即可关闭Google字体加载。

下载字体包

这是Wordpress-twentyfifteen主题(只针对twentyfifteen主题哦)所用到的字体文件,我已经打包好了,有需要的朋友请下载它们吧。

http://cdn.markdream.com/google/fonts/wp-twentyfifteen-google-fonts.tar.gz

上传字体包

将它们上传到你的服务器上确保能够使用《你的地址》访问它们,修改解压出来的“font.css”文件,将文件里面的“https://api.markdream.com/xxx”的路径替换成你的地址(按照你的实际情况修改),在上传到你的服务器上去覆盖即可。

非同级域名下面的字体文件加载配置(Nginx)

如果你和我一样不再同一个域名下面调用字体的话,你还需要修改一下Webserver的配置文件,我这里就以Nginx为例子:

location / {
     add_header Access-Control-Allow-Origin https://www.markdream.com;
}

那么你会发现,请求这个路径下面的时候Nginx会返回一个头信息,当然像Google这样的公共字体库大家都能够引用它的文件资源,Google字体库的配置大概是这样的:

location / {
     add_header Access-Control-Allow-Origin *;
}

好的绕的有点远,让我们继续回到刚才这里,我们在这里假设上面都已经正确执行了,那么我们来修改一个主题的源代码了,修改别人的源码最简单的方法就是直接进行修改(当然这只是初级阶段,你也得注意要备份),为了简便起见的话,找到我们的twentyfifteen主题下面的functions.php文件,大约在152行,将twentyfifteen_fonts_url方法替换成下面这个方法即可,注意把下面的“fonts-url路径”修改你的,你的,你的路径(重要的事情说三遍):

function twentyfifteen_fonts_url() {
  $fonts_url = 'https://api.markdream.com/libs/google-fonts/wp-twentyfifteen-google-fonts/font.css';
  return $fonts_url;
}

保存好之后,那么你应该是可以去看看你的首页上面是否出现了上面的地址呢?打开的浏览器去试试吧。

更新后续:新增简单优化方案,支持HTTP(s)

这里似乎有一个更好的解决方案,使劲戳这里