優化Wordpress的方法總結

Wordpress的功能很是強大，諸多的插件、花哨的界面，使得它的讀取速度也大大下降。所以，如何優化以加快訪問者的瀏覽速度便成了wper們思考的問題。我將諸多高手的方法進行了整理和總結，再結合本身優化的經驗匯成此文，但願能對你們有所幫助。

To be, or not to be: that is the question：
這是我想討論的第一個問題----就是有沒有必要作優化。在我看來，絕大多數我的博客是不須要作優化的。花不少時間對一個日訪問量不到100的博客作優化還不如花這點時間來好好充實本身的博客內容。
在準備本身的我的博客時最應該考慮的有2個問題。

首先是選一個合適的Linux主機。
其次儘量使用最新版本的WordPress，新版本在後臺有很大的改進，方便你本身使用、更新。
當你博客的訪問量穩步上升後，優化纔是你應該考慮的問題。

優化全部的圖片（images）：
圖片實際上是影響網頁讀取速度的關鍵，稍大一些的圖片就可能達到100K；所以，在上傳本身的圖片以前，務必用Photoshop的"保存至網頁"（save for web）功能，對圖片進行優化。（例如，保存成GIF, PNG格式等等）

關閉一切沒必要要的插件(plugins)：
在安裝插件以前，首先問一下本身，你是否必需要此插件。儘量的減小插件數量。

 開啓緩存(Cache)功能：

首先你能夠開啓WordPress自帶的緩存功能：
打開WP根目錄下的wp-config.php文件，在最後一行以前添加 define('ENABLE_CACHE',true);
將WP-content目錄下的cache目錄屬性改成777，以保證系統可以寫入cache。
若是您的blog日訪問量在200以上，建議安裝WP-Cache或者WP Super Cache插件，不然不推薦使用。我本身使用的是WP-Cache。
讓WP-Cache也用上Gzip：
若是你安裝了WP-Cache，必定知道WP-Cache要求必須關閉WP的內置GZip功能，可是咱們能夠在wp-cache-phase1.php中添加代碼來實現Gzip壓縮功能。 打開wp-cache-phase1.php，大概在35行左右找到以下代碼：
foreach ($meta->headers as $header) {
header($header);
在此代碼前添加下面的代碼：

if ( extension_loaded('zlib') ) ob_start('ob_gzhandler');
減小HTTP請求---合併JS和CSS文件:
很多插件都有本身的JS文件，系統在讀取這些文件時候會產生大量的http requests，產生的延遲約爲0.2秒/個。所以將全部的JS和CSS文件合併，會減小不少HTTP請求，大大加快頁面的讀取速度。
可是我不建議你們本身手動合併代碼，這裏我採用的是閱微堂的合併的方法 。
具體是創建一個新的all.js.php文件，內容是：

1 <?php
2 require_once('目錄/wp-blog-header.php' ) ;
3 include ("/blog/a.js" ) ;
4 include ("/b.js" ) ;
5 ?>
其實就是將header.php裏面的那些js文件都include到all.js.php，而後在header裏面包含all.js.php文件便可：

<script xsrc="all.js.php" type="text/javascript"/>
另外還要作的一件事情是須要把原來那些js文件從head裏面去掉。一般這些js文件都是經過

add_action('wp_head','fun' );
這樣的鉤子添加到head裏面的。在function函數的定義處去掉對應的代碼，或者直接把這條語句刪除便可。
對CSS文件也能夠用一樣的處理方式。CSS文件通常都很少，這時候能夠直接手動把它們都貼到一塊兒。 另外js文件的載入位置也很重要，放在越後面越好，讓瀏覽器先下載html代碼。像Google Analytics的js代碼最好放在文件最後。

合理放置css文件和js文件：
通常來講，css文件放在頁面頭部，而JavaScript腳本則最好放在頁面尾部，讓瀏覽器先下載html代碼。像Google Analytics 或者Google Ajax Search 這樣的大型js代碼最好放在文件最後。
壓縮代碼：
在管理界面的 Options->Reading選項中，開啓WP自帶的壓縮功能(WordPress should compress articles (gzip) if browsers ask for them)
利用CSS 優化工具壓縮CSS代碼，注意。爲了方便本身編輯，最好保留一份未通過壓縮的代碼。
利用Shrinksafe 壓縮JS代碼，一樣的，最好保留未通過壓縮的JS代碼，以便未來更改時候便於閱讀。
靜態化處理：
爲了省得生成太多的文件，我只對首頁作初始化。其實這個想法和用WP-Cache差很少，所不一樣的是 WP-Cache生成緩存頁面是靠瀏覽完成，而我說的方法倒是由服務器來完成。個人網頁中，Comments都是用javascript實時顯示的，因此我要作的只是在更新或添加post後刷新一次主頁。所用的程序以下：
01 <?php
02 function wwwcopy($link,$file)
03 {
04 $fp = @fopen($link,"r");
05 while(!feof($fp))
06 {
07 $cont.= fread($fp,1024);
08 }
09 fclose($fp);
10 $fp2 = @fopen($file,"w");
11 fwrite($fp2,$cont);
12 fclose($fp2);
13 }
14 //Example on using this function
15 wwwcopy("您的動態網頁（如 http://www.cnblogs.com/zhongbin）", "放置靜態網頁的絕對地址（如/home/jason/public_html/wordpress/index.html）");
16 ?>
記住要把index.html的屬性設置成666，這樣結果就是別人訪問你的網站時候，會直接先讀取靜態的首頁，大大加快了速度。

固然，若是你須要更多靜態化頁面的幫助，也能夠考慮安裝 cos-html-cache 這個插件。

利用Gzip對css、js還有html文件進行壓縮：
這步實際上是第六步的延續，由於gzip的壓縮比很好，以致於咱們能夠不用預先壓縮css和js代碼就能夠達到很好的壓縮比。
首先創建一個文件style.css.php，放在本身的theme目錄裏面。而後在header.php文件中把讀取style.css改成讀取style.css.php。 隨後在style.css.php文件添加以下代碼：

1 <?php
2 if(extension_loaded('zlib')){ob_start('ob_gzhandler');}
3 header("Content-type: text/css");
4 # echo the file’s contents
5 include($_SERVER['DOCUMENT_ROOT']."/wp-content/themes/default/style.css");//請自行更改css文件位置
6 if(extension_loaded('zlib')){ob_end_flush();}
7 ?>
js文件的壓縮方法相同，把all.js更名all.js.php，而後將上面要添加的代碼中的text/css改爲text/javascript便可。

而html文件，能夠用rewrite的方法，比方說個人index.html事實上是利用php讀取的index2.html規則，請在.htaccess文件中添加以下代碼：

RewriteRule index.html /readhtml.php [L]
readhtml.php文件的內容和以前讀取css文件的相似：

1 <?php
2 if(extension_loaded('zlib')){ob_start('ob_gzhandler');}
3 header("Content-type: text/plain");
4 # echo the file’s contents
5 include($_SERVER['DOCUMENT_ROOT']."/index2.html");//請自行更改html文件位置
6 if(extension_loaded('zlib')){ob_end_flush();}
7 ?>
利用Image Map減小meta部分的image讀取量：
本部分比較複雜，如不懂可跳過。
在閱讀這部份內容以前，你能夠點一下這個連接。Image
你所看到的就是我這個博客使用的背景圖。其實現原理就是把一些經常使用的image用一個大的image來代替，而且在css文件中設置爲背景。而後利用div的控制實現鼠標的懸停指向。

這裏以我siderbar下方的meta圖標爲例。
我使用的Two Columns的模版，所以，除了index.php文件外，還會有一個siderbar.php文件，meta信息都會放在這個文件中。通常咱們在 meta部分會添加很多圖標，因此咱們能夠將不一樣的圖標放到一個大的gif文件中，而後利用Slice Tools對圖片進行分割。

分割完成可在每一個Slice上右擊鼠標，讀取Slice的屬性，記下 下圖中的X,Y,W,H座標值。
如圖所示的就是圖標Creative Commons的座標(可點擊看大圖)。

接着在CSS文件中創建一個class

1 .creativec {
2 float:left;
3 margin-top:2px; //可本身更改
4 margin-left:0px; //可本身更改
5 background: url(images/bg.gif) no-repeat -41px -82px; //前者爲X座標，後者爲Y座標
6 width: 110px;
7 height: 29px;
8 }
有人還會在上面這段css定義中添加一句：

text-indent: -9900px;
主要用來將文字隱藏，但我不建議這樣作，這樣的話，在firefox中點擊會出現長長的虛框，影響美觀。
個人作法是此連接的title文字部分，用「&nbsp;」。回到個人例子，咱們就能夠在sidebar.php添加以下的信息。注意我在寫它的title時候用的是空格符號&nbsp;。

<a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/3.0/" title="Some Rights Reserved" class="creativec" target="_blank">&nbsp;&nbsp;&nbsp;&nbsp;</a>
把全部你會用到image都用這種方式修改。上傳更改過的全部文件，從新讀取，你會發現你網站loading的速度會快不少。你能夠按照每一個image所產生的http requests約爲0.2s來計算。

閱微堂還給出了一個全站靜態化的絕好方法，值得借鑑，尤爲是javascript讀取cookie的方法，相信對很多人都會有用。

還有一些方法或須要服務器根目錄的讀寫權限，或者須要數據庫的root權限，不具備廣泛性，就不列出了。