【WordPress】プラグイン［Contact Form 7］で必要なときだけスクリプトとスタイルシートを読み込む方法。

非常に便利な WordPress のプラグイン［Contact Form 7］ですが、このプラグインを有効化すると、すべてのページで JavaScript と　CSS のファイルが読み込まれるようになります。
通常、［Contact Form 7］を使うのは「お問い合わせページ」のみというケースがほとんどでしょうし、余分なファイルを読み込むことは直接的にページの表示速度を遅延させる原因にもなります。

きっとこの記事の読者の方も、こんな無駄をやめて、コンタクトフォームを含むページにだけ必要なファイルをロードすればいいのに、と考えていることでしょう。

しかし［Contact Form 7］の公式サイトによれば、「技術的な困難があって、ページをロードする時点でそのページがコンタクトフォームを含んでいるかどうかを判断することがプラグインにとって難しい」とのこと。

そこで WordPress テーマファイルの functions.php にちょっとした細工をして、任意のページにのみ［Contact Form 7］の付属ファイルを読み込ませるためのコードを紹介します。

function my_wpcf7_enqueue_scripts(){
	wp_dequeue_script( 'contact-form-7' );
	wp_dequeue_style( 'contact-form-7' );
	if (is_page('contact')) {
		if (function_exists( 'wpcf7_enqueue_scripts')) {
	 		wpcf7_enqueue_scripts();
		}
		if ( function_exists( 'wpcf7_enqueue_styles' ) ) {
			wpcf7_enqueue_styles();
		}
	}
}
add_action( 'wp_enqueue_scripts', 'my_wpcf7_enqueue_scripts');

コードの２行目と３行目、「 wp_dequeue_script('contact-form-7');」と「wp_dequeue_style('contact-form-7');」の部分で、一度［Contact Form 7］付属の JavaScript と CSS の読み込みを無効化しています。

その後４行目以降で、ページスラッグが「contact」の固定ページを表示させるときに［Contact Form 7］の付属ファイルを読み込ませる設定になっています。

４行目の「is_page('contact')」の箇所で引数を変更すれば、ファイルを読み込む任意の固定ページを指定できるようになります。
ぜひお試しください。