Google Fonts导致WordPress 速度问题的三个解决方案

77,484
Google Fonts导致WordPress 速度问题的三个解决方案
  • 4.25 / 5 5
4.25分(12票)
Google Fonts导致WordPress 速度问题的三个解决方案

本来实在是不想写这个的,因为相关方法在圈子里面已经烂大街了。但无奈,一些客户将近期的Google Fonts导致 WordPress 打开速度慢的现象归咎于我的主题——真TM 比窦娥还冤。所以,有必要在这里说下。

2015.2.26更新:Google Fonts 已可正常访问,相关插件可卸,本文已失效

Google Fonts导致WordPress 速度问题之原因

WordPress 自3.8+版本后加入了Google Fonts(别问我Google Fonts是什么了),然后捏,因为近期敏感周期(35号),天朝发威,谷歌的一系列网站被彻底墙,包括Google Fonts 所在的googleapis.com 。所以,如果是在登陆状态下打开你的WordPress 站点,会非常慢,因为压根儿加载不了这个字体文件。如果是非登陆状态且你的主题不是老外的主题,一般来说都是正常的。

解决方法

出来问题就要解决,在天朝,既然你不得不忍受之,那么就换个思路变通一下。下面的解决方法,思路一是禁止加载该Google Fonts,二是替换加载源。下面说明之:

方法一:【插件】禁止WordPress 后台加载Google Fonts

安装启用 Disable Google Fonts 或者 Remove Open Sans font Link from WP core 其中之一即可。没啥好说的。

方法二:【代码】直接在functions.php 文件添加代码

网络上有不少代码,下面可以参考下,具体有没有效果没有确认:

1
2
3
4
5
6
7
8
add_filter('gettext_with_context', 'disable_open_sans', 888, 4 );
function disable_open_sans( $translations, $text, $context, $domain )
{
if ( 'Open Sans font: on or off' == $context && 'on' == $text ) {
$translations = 'off';
}
return $translations;
}
1
2
3
4
5
6
function dw_remove_open_sans() {   
        wp_deregister_style( 'open-sans' );   
        wp_register_style( 'open-sans', false );   
        wp_enqueue_style('open-sans','');   
    }   
add_action( 'init', 'dw_remove_open_sans' );

方法三:【代码】替换open sans 字体的加载源

打开wordpress代码中的文件wp-includes/script-loader.php文件,搜索:fonts.googleapis.com 找到这行代码:

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

fonts.googleapis.com替换为fonts.useso.com

6月8日更新:该方法需要改动WordPress 核心代码,过于粗暴,不推荐,下面推荐个更好的代码法,我也将这个其弄成插件,你可以直接下载插件或者在当前主题中加入下面的代码:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<?php
/*
Plugin Name: DW Replace Open Sans
Plugin URI: http://devework.com/replace-open-sans.html
Description: 将WordPress 后台中的open-sans字体加载源从Google Fonts替换为360的CDN加载源。
Author: Jeff
Author URI: http://devework.com/
Version: 1.0
Text Domain: dw-replace-open-sans
*/
 
function devework_replace_open_sans() {
	wp_deregister_style('open-sans');
	wp_register_style( 'open-sans', '//fonts.useso.com/css?family=Open+Sans:300italic,400italic,600italic,300,400,600' );
	wp_enqueue_style( 'open-sans');
}
add_action( 'wp_enqueue_scripts', 'devework_replace_open_sans' );
add_action('admin_enqueue_scripts', 'devework_replace_open_sans');
?>

详细:DW Replace Open Sans:将WordPress 后台中的open-sans字体加载源从Google Fonts换为360 CDN

fonts.useso.com 是国内360推出的常用前端公共库CDN服务之一,“由于众所周知的原因,只需替换一个域名就可以继续使用Google提供的免费字体库了。同样,通过样式表引用这些资源,让网站访问速度瞬间提速吧骚年!”具体可以查看:http://libs.useso.com/。

喵~本文目前有48条留言,欢迎发表评论!

  1. 之前用360字体库还是挺好的,后来360那个字体库简直弱爆了,超级慢!

    [回复]
  2. 30#
    :

    Disable Google Fonts安了这个,可是还会看到font.google.慢
    Remove Open Sans font Link from WP core 这个更不好,是干掉默认的14 25的

    [回复]
  3. 29#
    :

    360的那个开始快,之后就超慢了,修改代码注释也试过了,开始OK,后来又慢了。可恶的2狗狗

    [回复]
  4. 28#
    :

    金桂冠

    [回复]
  5. 我用了百度经验推荐的一个插件叫googlefonts to 360,结果,,发现开页面的时候还是卡着的,chrome浏览器左下角显示的是链接到baiye.us,好像是这个插件的开发者的网站,他网站好像出问题了,现在怎么解决啊?这个插件把我哪个文件改了?

    [回复]
    • 你用那个干什么啊 用Replace Google Fonts 这个

      [回复]
  6. 26#
    :

    😮 拜读了,我说最近博客打开怎么这么慢,感谢分享!

    [回复]
  7. 25#
    :

    升级到4.0,发现慢很多,多谢博主的方法 😛

    [回复]
  8. 24#
    :

    如果仅作为阅读者的哈,可以试试这个插件

    http://liujiacai.net/gooreplacer

    [回复]
  9. 23#
    :

    我是把字体弄到自己网站,再把字体地址改成自己网站的,保留了字体也保证了稳定

    [回复]
    • 这种方法也不错

      [回复]
    • 朋友你可以做一个插件,相信有朋友需要的,因为目前useso还太不支持https请求,存在本地的话就解决了这个问题。

      [回复]
      • 好像国内某个大学的搞了个反向代理可以支持https的

        [回复]
        • 你还记得是哪个地址吗? 🙂

          [回复]
          • :

            中科大

            [回复]
  10. 22#
    :

    这个只能禁掉系统的google font,如果主题有用到google font, Disable Google Fonts 或者 Remove Open Sans font Link from WP core 以及楼主这个都无效,因为对没有主题做任何动作。我用的是“virtue”主题。最后我是修改主题代码解决的。

    [回复]
    • 本来就是指WordPress 自带的google font 的啊、、、

      [回复]
      • :

        分类说明会让人一目了然

        [回复]
  11. 21#
    :

    360的fonts不支持https。。。 👿 不是万不得已,不会用360的东西。。

    [回复]
  12. 最后这个方法,我觉得不错,快,管用。

    [回复]
  13. 请问方法三的代码只能用在你开发的devework主题上吗?其他的主题可不可以用?

    [回复]
  14. 18#
    :

    如果服务器在国外,CDN节点在香港,不改变是否会有影响呢?

    [回复]
  15. 17#
    :

    楼主,我的主题有点复杂,你能教我去掉谷歌字体,并且载入自己的字体吗?

    [回复]
  16. 16#
    :

    实在是没办法了 网站慢死了 赶紧用

    [回复]
  17. 15#
    :

    刚开始网站访问速度很慢,经过分析发现连接到google服务器出现了问题,导致网站加载后显示出来极慢。最后没办法只好把GoogleFonts的链接注释掉了。但是问题是网页里字体显得没有那么好看了。直到昨天看到这个插件,帮助我解决了很大的问题。感谢你的分享,受益极大。

    [回复]
  18. 14#
    :

    博主你好~ 请教下,
    我用方法三 将wp-includes/script-loader.php文件里的 fonts.googleapis.com替换为fonts.useso.com

    页面加载还是很慢。。浏览器(火狐)仍旧提示 正在连接 fonts.googleapis.com ?

    盼回复,谢谢!!

    [回复]
    • :

      同问,完成替换后把文件上传到站点,记载时仍然提示连接fonts.googleapis.com,怎样才能使得文件生效呢?重启web服务器?

      刚接触wordpress的小白,望博主指点。

      [回复]
      • 应该是主题自带的了gf文件

        [回复]
  19. 13#
    :

    我粗暴的把它替换为了360的cdn库。。。。

    // Remove Open Sans that WP adds from frontend
    if (!function_exists(‘remove_wp_open_sans’)) :
    function remove_wp_open_sans() {
    wp_deregister_style( ‘open-sans’ );
    wp_register_style( ‘open-sans’, false );
    }
    // 前台删除Google字体CSS
    // add_action(‘wp_enqueue_scripts’, ‘remove_wp_open_sans’);
    // 后台删除Google字体CSS
    add_action(‘admin_enqueue_scripts’, ‘remove_wp_open_sans’);
    endif;

    // add Open Sans fonts
    function my_open_sans(){
    $my_open_sans_fonts_url = “//fonts.useso.com/css?family=Open+Sans:300italic,400italic,600italic,300,400,600”;
    wp_register_style ( ‘my_open_sans_fonts’, ‘$my_open_sans_fonts_url’ );
    wp_enqueue_style ( ‘my_open_sans_fonts’ );
    }
    add_action(‘admin_enqueue_scripts’, ‘my_open_sans’);

    这样感觉既简单,又粗暴!!

    [回复]
    • 我的文章已经写了这个了啊,也做成了一个插件:http://devework.com/replace-open-sans.html

      [回复]
  20. 非常不错,支持了。
    免费版和收费版的区别是?

    [回复]
  21. 11#
    :

    方法3不能用function方式解决么?

    [回复]
    • 可以,已经有了:http://devework.com/replace-open-sans.html

      [回复]
  22. 10#
    :

    赶紧用,,要是访问google太慢了。

    [回复]
  23. 9#
    :


    该死的64
    正在找这样的CDN,谢谢分享

    [回复]
  24. 方法一中两个插件哪个好点?

    [回复]
  25. 点赞~ 😳

    [回复]
  26. 请问站长 如果方便的话 能否提供一下贵站首页文章前面的图片 鼠标掠过的时候 那一道闪光实现的方式或代码?非常喜欢。

    [回复]
    • 你自己打开开发者工具查看代码就可以了啊

      [回复]
  27. 最后一个方法,最管用。那速度忒快啊,然后捏在浏览器状态栏明显看到载入一闪而过。
    插件法没试过。 😀

    [回复]
  28. 🙂 真是及时雨啊,好东西

    [回复]
  29. 赶上地板鸟
    :

    这个评论是什么插件?

    [回复]
  30. 板凳也不错
    :

    ❗ 好牛逼!

    [回复]
  31. 传说中的沙发
    :

    修改后加载页面秒开,感谢分享!

    [回复]

打破沉默,我来发表评论鸟~