経験知ロゴ

WordPressでhead内に自動で読み込まれるCSSとJavaScriptファイルを読み込ませない3つの方法

head内のcssとjavascript

WordPressのテーマ内にある「wp_head()」関数は、WordPressが用意してあるjQueryやプラグイン各種が設定したJavaScriptファイルやCSSを自動でHTMLの「head」内に書き込みます。

これらのファイルが必要なら良いのですが、使う必要が無い場合はページの読み込みスピードを上げるためになるべく読み込みたくないですよね。

そこで、WordPressでhead内に自動で読み込まれるCSSとJavaScriptファイルを読み込ませない方法を3つ紹介します。

1.テーマファイル内に記述

テーマファイル内の「wp_head();」の直前に記述する。

JavaScriptの場合

「wp_deregister_script()」を使い「wp_enqueue_script()」で指定したJavaScriptファイルを読み込まないようにする。
jQueryの場合はこのようになる。

<?php
	wp_deregister_script( 'jquery' );
	wp_head();
?>

プラグインにより追加されるJavaScriptを読み込まないためには、プラグインファイルを「wp_enqueue_script」で検索して、「wp_enqueue_script」関数内の最初の引数を調べる。

例えばJetPackの「devicepx-jetpack.js」を読み込まないようにするため、JetPack内を「wp_enqueue_script」で検索すると

wp_enqueue_script( 'devicepx', set_url_scheme( 'http://s0.wp.com/wp-content/js/devicepx-jetpack.js' ), array(), gmdate( 'oW' ), true );

というコードが見つかる。最初の引数「 ‘devicepx’」を「wp_deregister_script()」に与えれば良い。

<?php
	wp_deregister_script( 'devicepx' );
	wp_head();
?>

CSSの場合

「wp_dequeue_style」を使い「wp_register_style()」で指定したCSSファイルを読み込まないようにする。

先程のように読み込みたくないプラグイン内を「wp_enqueue_style」で検索する。

JetPackの「top-posts/style.css」を読み込みたくない場合は、JetPack内を「wp_register_style」で検索すると

wp_register_style( 'jetpack-top-posts-widget', plugins_url( 'top-posts/style.css', __FILE__ ), array(), '20141013' );

というコードが見つかる。最初の引数「jetpack-top-posts-widget」を「wp_dequeue_style()」に与える。

<?php
	wp_dequeue_style( 'jetpack-top-posts-widget' );
	wp_head();
?>

これで「top-posts/style.css」を読み込まなくなる。

追記:「wp_register_style」で見つからなければ「wp_enqueue_style」でも探す。読み込まれたcssファイル名を直接検索するものあり。

2.functions.php内に記述

テーマファイル内にある「functions.php」で指定する方法。上記の「wp_deregister_script()」と「wp_dequeue_style()」を使うところまでは同じだが、関数内に記述しフックに登録する必要がある。

「functions.php」内に独自関数を作成する。ここでは「my_delete_plugin_files」という名前にしてみた。関数内に先ほどの記述をし、「add_action」で「wp_enqueue_scripts」に「my_delete_plugin_files」を登録。

function my_delete_plugin_files() {
	wp_deregister_script('jquery');
	wp_dequeue_style( 'jetpack-top-posts-widget' );
}
add_action( 'wp_enqueue_scripts', 'my_delete_plugin_files' );

他にも読み込ませたくないファイルがあれば関数内に追加していけば良い。

Noticeエラー

jQueryを読み込ませないときは

wp_deregister_script( 'jquery' );

と記述したが、これだとデバッグモード時に

Notice: Undefined index: jquery in /var/www/wordpress/wp-includes/class.wp-scripts.php on line 201

Notice: Trying to get property of non-object in /var/www/wordpress/wp-includes/class.wp-scripts.php on line 201

というエラーが表示される。解決策として2つ見つけた。

一つ目は無理矢理な方法で非推奨。実行は自己責任で。エラーの原因の「$wp_scripts」内の値を削除する。functions.phpの先ほどの記述より前に

global $wp_scripts;
unset($wp_scripts->queue[0]);

を書く。これでNoticeエラーは表示されなくなる。

もう一つは次で紹介する3つ目の方法で読み込まなくさせるとエラーは表示されない。

3.ファイル自体読み込ませない

個別に指定するのが面倒くさく、そもそも勝手にCSSやJavaScriptを読み込んでほしくない時に有効な方法。この設定をすると動かなくなったり表示が崩れるプラグインもあるので要注意。

ファイル自体を読み込まないようにするには「remove_action」を使用する。

CSSファイルを読み込まないようにするには

remove_action( 'wp_head', 'wp_print_styles',8);

JavaScriptをhead内で読み込まないようにするには

remove_action( 'wp_head', 'wp_print_head_scripts',9);

footer内で読み込まないようにするには

remove_action( 'wp_head', 'wp_print_footer_scripts',20);

を「functions.php」に記述すれば良い。

週3日の副業で月50万

月50万稼げたら年収は600万で、普通の人以上の生活ができます。

それが週3日で稼げたら、残りの4日をどう過ごしますか?

  • 自分の趣味に全力を注ぐ
  • 家族との時間を増やし、子供の成長をしっかりと見守る
  • 毎週海外へ旅行へ行く
  • 新しいことに挑戦する
  • 何もせず、のんびり自由な時間を過ごす

週の半分以上が自分の好きなことに使えるのなら、人生は楽しい物になりますよね!

週2日の休みが増えるということは、

52週(1年) × 2日 = 104日

年間104日も増え、365日のうち208日も自分の時間に使えるのです!

更に、今30歳だとして、65歳まで働いたら、

104日 × 35年 = 3,640日

3,640日も変わってきます!!10年以上ですよ!10年!!

週2日の休みのために5日を無駄にする生活をいつまで続けますか?

週4日の自由たった3日で稼いで、自分のために自由に時間を使う生活をはじめましょう!

週3日で50万円稼げる案件は、業界最大級の案件を保有しているレバテックフリーランスで見つけられます。

1分で完了する無料登録で、時間の自由への一歩を踏み出しましょう!

おわりに

いろいろ自動でやってくれるWordPressは便利ですが、余計なものもありますので必要な物だけ使えるようになりたいですね。

▼役に立ったらシェアをお願いします