WEB-DL

WordPress主题替换(禁用)谷歌字体和前端库优化大陆地区访问网站速度

WordPress后台字体默认是调用 fonts.googleapis.com 的,在国内访问通常会很慢,甚至有时候打不开页面。最简单的方案,就是替换在线字库地址。

一、替换字体源

1.编辑“wp-includes/script-loader.php”,搜索“fonts.googleapis.com”找到以下代码,把“fonts.googleapis.com”替换成“fonts.geekzu.org”即可,后台加速就搞定了。

$open_sans_font_url = "//fonts.geekzu.org/css?family=Open+Sans:300italic,400italic,600italic,300,400,600&subset=$subsets";

2.如果用了官方主题,或是主题里引用了 Google 字体,同理替换即可:编辑“wp-content\themes\你的主题\functions.php”,把“fonts.googleapis.com”替换成“fonts.geekzu.org”。

3.有些主题还在其他自定义的页面、css等处加了字体源,也需要将“fonts.googleapis.com”替换为“fonts.geekzu.org”。

以下是几个替换源,目前还是极客的速度快一点

谷歌字体库(Google Fonts)

源地址://fonts.googleapis.com/css?family=Open+Sans
极客族加速://fonts.geekzu.org/css?family=Open+Sans
loli加速://fonts.loli.net/css?family=Open+Sans
中科大加速://fonts.lug.ustc.edu.cn/css?family=Open+Sans

源地址://themes.googleusercontent.com/
极客族加速://gapis.geekzu.org/g-themes/
loli加速://themes.loli.net/
中科大加速://google-themes.lug.ustc.edu.cn

Google前端库(Google Hosted Libraries)

源地址://ajax.googleapis.com/
极客族加速://gapis.geekzu.org/ajax/
loli加速://ajax.loli.net/
中科大加速://ajax.lug.ustc.edu.cn
Gravatar全球头像
源地址://*.gravatar.com/avatar/
极客族加速://sdn.geekzu.org/avatar/
loli加速://gravatar.loli.net/

二、谷歌在线字体本地化读取

1.在网页的源代码(假设为 index.html )中,找到引用了谷歌字体的部分,如:

<link href="http://fonts.googleapis.com/css?family=Open+Sans:300,800" rel="stylesheet" type="text/css" />

2.在网页浏览器中访问上面的地址 http://fonts.googleapis.com/css?family=Open+Sans:300,800 ,可以得到一个 css 文件,文件内容为:

@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 300;
src: local('Open Sans Light'), local('OpenSans-Light'), url(https://themes.googleusercontent.com/static/fonts/opensans/v8/DXI1ORHCpsQm3Vp6mXoaTaRDOzjiPcYnFooOUGCOsRk.woff) format('woff');
}
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 800;
src: local('Open Sans Extrabold'), local('OpenSans-Extrabold'), url(https://themes.googleusercontent.com/static/fonts/opensans/v8/EInbV5DfGHOiMmvb1Xr-hqRDOzjiPcYnFooOUGCOsRk.woff) format('woff');
}

把它保存到本地,可命名为 OpenSans.css 。在 index.html 所在的位置新建一个目录,命名为 googlefonts ,将刚才得到的 OpenSans.css 文件放置在这个目录下。

3.在上面的 OpenSans.css 文件中,可以找到字体文件的地址,即:

https://themes.googleusercontent.com/static/fonts/opensans/v8/DXI1ORHCpsQm3Vp6mXoaTaRDOzjiPcYnFooOUGCOsRk.woff]]]

https://themes.googleusercontent.com/static/fonts/opensans/v8/EInbV5DfGHOiMmvb1Xr-hqRDOzjiPcYnFooOUGCOsRk.woff

4.将这两个文件下载到本地(不需修改文件名。以下的步骤假设保存时未修改文件名,若修改了文件名请自行修改以下步骤中的内容),并放置在 googlefonts 目录下。

修改 OpenSans.css 文件,将字体的地址改为本地地址,即将:

https://themes.googleusercontent.com/static/fonts/opensans/v8/DXI1ORHCpsQm3Vp6mXoaTaRDOzjiPcYnFooOUGCOsRk.woff

修改为:

DXI1ORHCpsQm3Vp6mXoaTaRDOzjiPcYnFooOUGCOsRk.woff

对另一个 woff 文件链接同样地做处理,即将:

https://themes.googleusercontent.com/static/fonts/opensans/v8/EInbV5DfGHOiMmvb1Xr-hqRDOzjiPcYnFooOUGCOsRk.woff

修改为:

DXI1ORHCpsQm3Vp6mXoaTaRDOzjiPcYnFooOUGCOsRk.woff

修改 index.html ,将 css 的地址改为本地地址,即将:

<link href="http://fonts.googleapis.com/css?family=Open+Sans:300,800" rel="stylesheet" type="text/css" />

修改为:

<link href="googlefonts/OpenSans.css" rel="stylesheet" type="text/css" />

三、安装插件移除或本地化Google Fonts

可以使用OMGF插件、Autoptimize插件、Perfmatters插件等插件移除或本地化谷歌字体,插件使用方法及其他插件请自行百度谷歌找,本文不详细介绍。

码字很辛苦,转载请注明来自非WEB-DL资源站《WordPress主题替换(禁用)谷歌字体和前端库优化大陆地区访问网站速度》

评论