關於CSS和JS合併的WordPress插件

下面由WordPress技巧專欄跟大家介紹CSS和JS合併的WordPress插件，希望對需要的朋友有幫助！

我們平常會考慮把多個CSS或JS合併為一個文件輸出，為了解決這個問題，我寫了這個WordPress插件，用來實現WordPress中的這一目的。

實作原理

如果你讀過我之前的《PHP合併壓縮css輸出模組化css撰寫》可以先了解我對快取檔案的一些處理方式，以及合併檔案、壓縮程式碼的一些想法。而本插件的實作原理基本上和上面的這篇文章裡介紹的差不多。

安裝

首先，下載這個插件，我把它託管在我的GitHub上，你可以在這個頁面下載。下載好之後，進行解壓，解壓縮完直接把解壓縮出來的整個資料夾上傳到你的WordPress網站外掛目錄下。然後去後台啟用它。

使用

進入後台，在“設定”選單下有一個子選單“Minify”，進入後可以對它的各個選項進行設置，而且都有註釋，可以了解功能。

使用wp-minify必須修改主題，因為你輸出css和js的方式不一樣了。在你的主題中，刪除原來的CSS和JS輸出，使用如下的方法輸出JS：

<?php wp_minfiy_js([&#39;/wp-content/themes/yourtheme/js/base.js&#39;,&#39;/wp-content/themes/yourtheme/js/module.js&#39;,&#39;/wp-content/themes/yourtheme/js/others.js&#39;]); ?>

輸出css的方法是一樣的，只不過要使用另外一個函數wp_minify_css()。函數的參數是一個數組，數組內部的元素是腳本檔案的路徑，以WordPress安裝目錄為根目錄，寫入完整的相對路徑。

為什麼要相對於WordPress的根目錄寫腳本呢？而不是相對你目前的主題目錄呢？其實道理很簡單，因為你所引用的css或js不一定是主題目錄下的，有的時候你會引用其他目錄下面的樣式或腳本。當然，這是相對路徑，你甚至可以引用WordPress上一級目錄的腳本，例如 "/../test.js"，但是注意，腳本的開頭一定要用/開頭，否則可能引起相對路徑錯誤。

當然了，具體的使用方法在你了解了原理之後就可以非常容易的去自己修改或發揮。

更多WordPress技術文章，請造訪WordPress建站教學欄位！

以上是關於CSS和JS合併的WordPress插件的詳細內容。更多資訊請關注PHP中文網其他相關文章！