WordPress:プラグイン有効時に読み込むCSSやJSを削除する方法

  • Posted on
  • Category : WordPress
WordPress:プラグイン有効時に読み込むCSSやJSを削除する方法

WordPressでプラグインを使用する際、プラグインによっては見栄えを整えたり動きを付けるために独自のCSSやJSを自動的に読み込むものがありますが、それらはプラグインの機能を使用していないページにまで読み込まれます。それを特定のページでしか読み込ませないようにしたり、いっそのこと全ページから削除する方法です。

2014年9月14日 追記
下記で紹介している方法はそれぞれwp_print_styleswp_print_scriptsを使用しているのですが、これらはWordPress 3.3から非推奨となっていました…。
3.3以降からは代わりにwp_enqueue_scriptsを使用するということになっているので、それを用いた方法で追記しました。

今回はプラグインを有効化するとCSSとJavaScriptがそれぞれ全ページで読み込まれるもので、WordPressを使ったことがあるなら多くの方が使用したことがあると思う「Contact Form 7」を例に説明します。

特定のページ以外から削除する

特定のページ以外ではCSSとJavaScriptを削除したい(特定のページだけで読み込ませたい)という場合は、functions.phpへ以下のように記述することで実装できます。
以下はスラッグが「contact」という固定ページ以外ではCSSとJSを読み込んでいる部分を削除するというものになり、他のスラッグを指定する場合はそれぞれ赤文字部分を任意で変更してください。
また、今回は固定ページを使用している想定でis_singleを使用しているので、固定ページ以外での場合はこの部分もそれぞれ任意で変更してください。

functions.php

// スラッグが「contact」以外のページからスタイルを削除する
add_action( 'wp_print_styles', 'deregister_styles' );
function deregister_styles() {
	if ( ! is_page( 'contact' ) ) {
		wp_deregister_style( 'contact-form-7' );
	}
}

// スラッグが「contact」以外のページからスクリプトを削除する
add_action( 'wp_print_scripts', 'deregister_scripts' );
function deregister_scripts() {
	if ( ! is_page( 'contact' ) ) {
		wp_deregister_script( 'contact-form-7' );
	}
}

上記は指定にスラッグを使用しましたが、もちろんIDでも指定することができます。
例えばIDが「10」のページ以外は削除したいという場合は、functions.phpへ以下のように記述することで実装できます。

functions.php

// IDが「10」以外のページからスタイルを削除する
add_action( 'wp_print_styles', 'deregister_styles' );
function deregister_styles() {
	if ( ! is_page(10) ) {
		wp_deregister_style( 'contact-form-7' );
	}
}

// IDが「10」以外のページからスクリプトを削除する
add_action( 'wp_print_scripts', 'deregister_scripts' );
function deregister_scripts() {
	if ( ! is_page(10) ) {
		wp_deregister_script( 'contact-form-7' );
	}
}

全ページから削除する

全ページから削除したいという場合は先ほどのソースから条件分岐を外せばいいだけなので、functions.phpへ以下のように記述することで実装できます。

functions.php

// 全ページからスタイルを削除する
add_action( 'wp_print_styles', 'deregister_styles' );
function deregister_styles() {
	wp_deregister_style( 'contact-form-7' );
}

// 全ページからスクリプトを削除する
add_action( 'wp_print_scripts', 'deregister_scripts' );
function deregister_scripts() {
	wp_deregister_script( 'contact-form-7' );
}

今回は「Contact Form 7」を例に説明しましたが、他のプラグインでも同じように削除したいという場合はwp_deregister_style()wp_deregister_script()の部分を変更・追加すれば削除することができます。
プラグインによっては管理画面でCSSやJSは読み込まないという設定をできるものもありますが、それだと当たり前ですが全てのページで読み込まなくなってしまうので、先述したように特定のページ以外で読み込ませなくしたい場合に便利な方法だと思います。

2014年9月14日追記:wp_enqueue_scriptsを使用する方法

上記ではそれぞれwp_print_styleswp_print_scriptsを使用しているのですが、これらはWordPress 3.3から非推奨となっており、何人かの方からもご指摘いただいたので、Codexにも代わりに使用するようにと載っているwp_enqueue_scriptsを使用する方法で追記しました。

以下はスラッグが「contact」という固定ページ以外ではCSSとJSを読み込んでいる部分を削除するというものになり、同じくfunctions.phpに記述をします。

functions.php

add_action( 'wp_enqueue_scripts', 'deregister_cf7_files' );
function deregister_cf7_files() {
	if ( ! is_page( 'contact' ) ) {
		wp_dequeue_style( 'contact-form-7' );
		wp_dequeue_script( 'contact-form-7' );
	}
}

変更された部分は見ての通りですが、wp_deregister_xxxとなっていた部分はwp_dequeue_xxxとなり、アクションフックはwp_enqueue_scriptsになっています。
上記はスラッグに対しての方法になりますが、全ページから削除する場合や特定のIDからの場合もこれらを用いた感じで変更すれば実装できます。
それぞれの詳細については以下Codexで確認できます。

Back to Top

WordPress:プラグイン有効時に読み込むCSSやJSを削除する方法

WordPress:プラグイン有効時に読み込むCSSやJSを削除する方法

/ WordPress

Tagged with:

NxWorld

Sorry... doesn't support your browser

To get the best possible experience using our site we recommend that you upgrade to a modern web browser.NxWorldではご利用中のブラウザサポートはしていません。
Internet Explorerのアップグレード行う、もしくはその他のブラウザを使用しての閲覧をお願いします。