WordPress Remove Contact Form 7 JS And CSS
網站效能微調，移除不需要載入的檔案！
Contact Form 7 是一款聯絡表單外掛程式，在我經手的很多 WordPress 網站上都有安裝這一款外掛程式。基本是這是一款十分穩定，個人認為效能也還算不錯的外掛程式。不過最近朋友看到有其他網誌寫到 10 款拖慢網站速度的外掛程式，Contact Form 7 也名列其中，因此詢問應該要怎麼處理才好。雖然我個人並沒有遇到網站速度被拖慢的情況發生，不過 Contact Form 7 官網文件，倒是也有提到在需要執行時再載入 JavaScript 與 Stylesheet，這樣應該或多或少可以減低外掛程式對網站運作的影響，接下來的內容就是跟大家分享如何移除 JS 與 CSS（WordPress Remove Contact Form 7 JS And CSS）在需要的頁面才載入。
WordPress Remove Contact Form 7 JS And CSS
Contact Form 7 官網文件中很清楚的介紹了兩個停止載入 JavaScript and Stylesheet 的方法。
- 一種方法是直接在 wp-config.php 檔案裡標記停用 JS And CSS，其與法如下。
|
1 2 |
define('WPCF7_LOAD_JS', false); define('WPCF7_LOAD_CSS', false); |
- 另外一種方式是透過編輯子佈景主題的 functions.php 檔案，停止載入 JavaScript and Stylesheet。它的語法如下：
|
1 2 |
add_filter( 'wpcf7_load_js', '__return_false' ); add_filter( 'wpcf7_load_css', '__return_false' ); |
- 上述兩種方法都可以停止載入 Contact Form 7 的 JavaScript and Stylesheet 檔案，只需要擇一使用就可以。但是這樣設定方式連正常的聯絡表單也無法使用了，因此官網文件又建議了在 contact.php 聯絡表單檔案中需要加入以下語法。
|
1 2 3 4 5 6 7 8 9 |
<?php if ( function_exists( 'wpcf7_enqueue_scripts' ) ) { wpcf7_enqueue_scripts(); } if ( function_exists( 'wpcf7_enqueue_styles' ) ) { wpcf7_enqueue_styles(); } ?> |
- 不過一般的佈景主題不一定會建置有 contact.php 檔案，或是很多新手朋友也不會自己建置 contact.php 檔案，因此接下來我們要分享一個透過編輯子佈景主題 functions.php 檔案，來建置篩選的功能。當頁面試聯絡表單頁面時才載入 Contact Form 7 的 JavaScript and Stylesheet 檔案，其他的頁面或是文章都不會再載入 Contact Form 7 的 JavaScript and Stylesheet 檔案。
|
1 2 3 4 5 6 7 8 9 10 |
function load_contactform7_on_specific_page(){ // 100 是指聯絡表單頁面的 ID if(! is_page(100) ) { wp_dequeue_script('contact-form-7'); // 載入 JavaScript 檔案 wp_dequeue_style('contact-form-7'); // 載入 CSS 檔案 } } add_action( 'wp_enqueue_scripts', 'load_contactform7_on_specific_page' ); |
結論
說真的我個人沒有遇過因為外掛程式的檔案造成拖慢網站速度的情況發生，因此對於許多評論外掛程式效能的建議保持開放的態度。每個網站的運作環境大不相同，網站管理沒有一定的要素。所以每一位網站管理者都應該視實際的網站運作情況來微調，才是最佳的網站管理方法。
參考文件：Loading JavaScript and Stylesheet Only When it is Necessary
