WordPress 的 Google 字体问题解决办法

在国内访问的时候,WordPress 里面引用的 google 字体可能会导致加载速度变得很慢。

要修改的地方有(我使用的版本是 4.0):

wp-includes 里面的 script-loader.php 有一行:

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

你使用的主题里面的引用,以我用的 twentytwelve 主题为例:

在:wp-content/themes/twentytwelve/functions.php 里面有一行:

$font_url = add_query_arg( $query_args, "$protocol://fonts.googleapis.com/css" );

把这些里面的 fonts.googleapis.com 替换成 fonts.useso.com。

但是我直接浏览器访问 fonts.useso.com 后发现这个服务是 360 做的。

。。。

如果不想依赖 360 的服务怎么办?

我的解决方法是手动下载 .css 和所有其中引用的 woff2 字体文件,然后存在自己的服务器上(但此法的问题是如果你升级了,或者安装了新主题,就可能会导致字体找不到)。

具体步骤:

1.首先从代码得到所有对 google 字体请求的参数,或者使用浏览器的开发者工具监听对 fonts.googleapis.com 的请求。并组合起来自己用浏览器请求一次,得到一个 css。

比如看到有这两个:

?family=Open+Sans:300italic,400italic,600italic,300,400,600&subset=latin,latin-ext
?family=Open+Sans:400italic,700italic,600italic,400,700&subset=latin,latin-ext

那么就自己用浏览器访问

https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,300,400,600,700&subset=latin,latin-ext

得到一个 css 文件,包含了两处引用都需要的资源。

2.使用文本编辑器在里面搜索出所有字体的静态链接。

我使用的是 Sublime Text,在里面进行正则表达式搜索,我的搜索条件是:

https://fonts.gstatic.*?.woff2

把它们复制出来

https://fonts.gstatic.com/s/opensans/v10/K88pR3goAWT7BTt32Z01m5Bw1xU1rKptJj_0jans920.woff2
https://fonts.gstatic.com/s/opensans/v10/RjgO7rYTmqiVp7vzi-Q5UZBw1xU1rKptJj_0jans920.woff2
https://fonts.gstatic.com/s/opensans/v10/ttwNtsRpgsxVmgGGmiUOEpBw1xU1rKptJj_0jans920.woff2

.......

粘贴到下载工具里面(如迅雷),批量下载。

3.字体文件和 css 全部上传到你自己的服务器。

4.把 css 文件里面的链接查找替换成在你服务器上的地址。

5.最后把 wordpress 里面的引用 fonts.googleapis.com 的链接替换成你自己的地址。

完成。

时间: 2024-10-17 04:14:06

WordPress 的 Google 字体问题解决办法的相关文章

WORDPRESS 中 GOOGLE 字体的最佳替代方案

http://androidren.com/index.php?qa=305&qa_1=wordpress-%E4%B8%AD-google-%E5%AD%97%E4%BD%93%E7%9A%84%E6%9C%80%E4%BD%B3%E6%9B%BF%E4%BB%A3%E6%96%B9%E6%A1%88 http://forlong401.com/?p=1327 下面所述基于:WordPress 4.1版本 主体思路是: 将 fonts.googleapis.com 替换为 fonts.uses

Gitbook 生成 pdf 中文字体错乱问题解决办法

Gitbook 生成 pdf 中文字体错乱问题解决办法 用过 Gitbook 的都知道, Gitbook 会自动生成 pdf 以提供下载, 但十分遗憾的是自动生成的 pdf 对中文的支持并不好, 经常出现字体不一致的现象, 影响阅读, 强迫症更是难以忍受. 示例: 下面针对这一问题提供简单的解决办法: 本地命令行生成 pdf 文件. 当然这种方法有一定局限性, 你需要找到托管在 github 对应的源码仓库且转换过程中不出错. (由于水平有限未能解决在线生成的pdf中文字体错乱问题, 见谅. 也

干掉Google字体,WordPress速度暴涨

2014年7月7日23:40:31 因为Google被墙,WordPress引用的Google字体总会加载很长时间,严重影响打开速度. 安装WordPress插件 Disable Google Fonts 可解决,速度暴涨,再也不用担心网站的加载时间了! 干掉Google字体,WordPress速度暴涨,布布扣,bubuko.com

wordpress google字体和gravatar头像不显示问题处理

wordpress 安装好后,发现网站打开很慢. 查看原因后发现是因为总所周知的原因:google字体无法加载.gravatar头像无法加载. 在网上查了下,说是要把google字体加载连接修改下,和gravatar头像加载连接修改下. 但修改源文件了,下次 wordpress 升级就会失效. 在网上找了个 wordpress 的插件,解决了google字体加载问题,看了下源码,修改了下,也解决了gravatar头像的问题. 代码如下: <?php function izt_cdn_callba

网页引用google字体速度慢:fonts.googleapis.com

由于众所周知的原因,国内使用google font库有很大的问题. 使用国内镜像如360网站卫士常用前端公共库CDN服务 http://libs.useso.com/ 优点:使用方便 缺点:目标用户包含国外的开发者,不清楚国外用户的加载速度 google字体库:fonts.useso.com google公共库:ajax.useso.com 常用前端公共库:libs.useso.com 一个个人的库:http://fonts.gmirror.org/ 本次使用AdminTLE UI框架发现页面加

matlab linux 中文显示问题解决办法

matlab linux 中文显示问题解决办法 2011-09-26 17:07:06|  分类: 默认分类 |  标签: |举报 |字号大中小 订阅 下面的方法你试试看哈! 由于Linux下Matlab的图形界面是用Java写的,所以只要搞定Java的中文显示就行了.1.我Matlab2007a的JRE目录为:/opt/matlab/sys/java/jre/glnx86/jre1.5.0 请根据自己的安装目录和版本确定JRE的目录:2. $ cd /opt/matlab/sys/java/j

360网站卫士推出google字体加速方案

最近,有网友反映称谷歌官网域名google.com.谷歌香港google.com.hk都打不开, ping了一下google.com和google.com.hk两个域名的服务器情况,最后ping出来的IP地址均显示为“美国”,也就是说谷歌香港(google.com.hk)的服务器,已由香港转移至美国,所以链接时间会很长,甚至断断续续出现请求超时的情况. 图:google.com.hk域名服务器ping测结果 Google服务在大陆的崩溃情况不仅影响到了广大网民,也影响到了数百万的站长.WordP

Android ScrollView嵌套ScrollView滚动的问题解决办法

引用:http://mengsina.iteye.com/blog/1707464 http://fenglog.com/article.asp?id=449 Android ScrollView嵌套ScrollView滚动的问题解决办法 原文地址:http://trivedihardik.wordpress.com/2011/09/19/scrollview-inside-scrollview-scrolling-problem/ 搞技术的多少看的懂E文,也不翻译了. While design

IE浏览器兼容问题解决办法

怎么用一行代码解决CSS各种IE各种兼容问题 用一行代码来解决CSS在,IE6,IE7,IE8,IE9,IE10 中的各种兼容性问题. 在网站前端写代码的过程中,很多时间IE各个版本的兼容问题很难整.现在百度与谷歌都有了一行解决这种兼容性的代码了.如下面的. 百度办法: 百度也应用了这种方案去解决IE的兼容问题 百度源代码如下 <span style="color:#333333;"><!Doctype html> <htmlxmlns=http://ww