WordPress优化之Gzip压缩CSS和JS文件

之前在【WordPress最强优化—开启Gzip压缩】一文中说到可以Gzip压缩网页(不包括CSS和JS文件)来达到加速的目的。这对于大部分个人博客来说是够用的,但是对于那些使用了大量炫丽的CSS特效或者大量JS的WordPress网站来说,还远远不够,那么,能否用Gzip压缩CSS和JS呢?答案是:能!

Gzip压缩CSS方法(以style.css文件为例):

1.将以下代码加入style.css文件的的头部:

<?php if(extension_loaded('zlib')) {ob_start('ob_gzhandler');}
header("Content-type: text/css"); ?>

2.将以下代码加入style.css 文件的的尾部:

<?php if(extension_loaded('zlib')) {ob_end_flush();} ?>

3.将文件更名为:style.css.php

4.找到header.php文件中引用style.css处,将其更名为:style.css.php,例如:

将以下代码:

<link rel="stylesheet" href="http://www.jeriffcheng.com/wp-content/themes/twentyten/style.css" type="text/css" />

改为:

<link rel="stylesheet" href="http://www.jeriffcheng.com/wp-content/themes/twentyten/style.css.php" type="text/css" />

 

Gzip压缩JS方法:

步骤和压缩CSS文件一样,只是第1步的代码改为:

<?php if ( extension_loaded('zlib') ) {ob_start('ob_gzhandler');}
header("Content-Type: text/javascript"); ?>

第2步的代码改为:

<?php if(extension_loaded('zlib')) {ob_end_flush();} ?>

第3步,第4步类似。

注:以上方法来自 dboy~小真の365天的博文,经笔者验证有效;修改文件前先备份文件;如果正在使用WP Minify这类可以Gzip压缩CSS和JS文件的插件,要先禁用。

IE7,Opera貌似不支持这种压缩的CSS文件,请自行检验

  10Comments

  1. Bluesky   •  

    你好,按照这个方法会出现加载不了style.css.php的情况,路径没错,权限也一样。
    我的wp版本3.2.1,主机是nginx,我见你的主机是Apache,也没用这个方法。

  2. 草帽luffy   •  

    wp真的很不错。
    最近到wp官网转了转,发现它已经不仅仅是个blog系统了,功能强大到完全可以建站了——各种功能插件非常完善,而且具备灵活的定制性。

    • Jeriff Cheng   •     Author

      是的,商务网站、商店系统、问答平台各种类型的网站都可以 通过强大的主题插件来实现!WordPress就是网站程序里的 Firefox!

      • 潜行者m   •  

        这个比喻不太恰当,firefox还有chrome等同领域比较强大的竞争对手,wordpress呢?

        • bighead   •  

          wordpress的竞争对手有joomla 、drupal

          • Jeriff Cheng   •     Author

            WordPress没有竞争对手。独孤求败

  3. Terry Chen   •  

    恩,好专业啊!下次折腾主题的时候试试!

Leave a Reply

Your email address will not be published. Required fields are marked *