WEBOPIXEL

WordPressでプラグインによって読み込まれる外部スタイルシート&javascriptを削除する

Posted: 2011.02.05 / Category: WordPress / Tag: 

Wordpressには便利なプラグインがたくさんあってついつい多く入れてしまいがちですが、画面に表示させるタイプのプラグインは独自にスタイルシートを読み込んだりしています。
プラグインごとにファイルを別けた方がメンテナンスはしやすいかもしれませんが、外部ファイルはなるべくまとめた方がリクエスト数を減らすことができてパフォーマンスが良いらしいです。
プラグインによって自動的に読み込まれたスタイルシートを削除する方法をご紹介します。

Sponsored Link

※Wordpressのバージョンは3.04を使用します。

「wp-pagenavi」プラグインのCSSを削除する。

よく使用されるプラグインとして、「wp-pagenavi」なんかがありますね。
これを使用すると以下のCSSがheadに追加されます。

		<link rel='stylesheet' id='wp-pagenavi-css'  href='http://www.example.com/wp-content/plugins/wp-pagenavi/pagenavi-css.css?ver=2.70' type='text/css' media='all' /> 
	

functions.phpに以下のコードを追加すれば削除できます。

function.php

		add_action( 'wp_print_styles', 'my_deregister_styles', 100 );
		function my_deregister_styles() {
			wp_deregister_style( 'wp-pagenavi' );
		}
	

プラグインによって「wp_deregister_style」の引数を変更する必要があります。
この中の文字列はプラグインの「wp_enqueue_style」で指定された文字列を入れます。
grepなんかでプラグインフォルダを検索すれば簡単に見つかると思います。

ちなみに「wp-pagenavi」の場合はcore.phpに以下のように指定してあります。

core.php

		wp_enqueue_style( 'wp-pagenavi', $css_file, false, '2.70' );
	

ちなみにこのプラグインは設定でCSSを読み込みをOFFにできるので、あえてfunctionsで設定する必要はないですね……。

「contact-form-7」プラグインのCSSを削除する。

「contact-form-7」も結構使用されているプラグインですよね。
このプラグインは基本的にフォームのページだけCSSは読み込めば良いと思うのですが、全てのページで読み込みを行ってしまうようです。
なので削除してみます。

function.php

		add_action( 'wp_print_styles', 'my_deregister_styles', 100 );
		function my_deregister_styles() {
			wp_deregister_style( 'wp-pagenavi' );
			wp_deregister_style( 'contact-form-7' );
		}
	

やってることは同じですね。
複数指定する場合は「wp_deregister_style」を下に追加していけばいけます。

「contact-form-7」は外部javascriptも読み込まれます。
せっかくなんでこれも削除してみましょう。

function.php

		add_action( 'wp_print_scripts', 'my_deregister_script', 100 );
		function my_deregister_script() {
			wp_deregister_script( 'contact-form-7' );
		}
	

「style」となっている部分を「script」とするだけですね。

参考サイト: WordPress trick: Disable plugin stylesheet

COMMENTS

Kissy 2013-03-20 18:31 

contact-form-7を有効にするとjqueryを利用したスムーススクロール(http://2inc.org/blog/2012/02/14/1233/)が上手く機能しなかったのですが上記内容で無事成功しました。
大変役に立ちました。ありがとうございました。

LEAVE A REPLY

コードを書く場合は<pre>で囲んでください。