WordPressの「Contact Form 7」というメールフォーム用のプラグインを使っています。
設定も簡単にできてあっという間にメールフォームを実装できる便利なプラグインなんですが、メールフォームがないページにもheadタグ内にCSSとJavascriptが表示されるのが気になってしまって。
というわけで、必要ないページではCSSとJavascript自体を読み込まないようにする方法をご紹介します。
目次
Contact Form 7に関するCSSとJavascriptの記述を消す
ソースを見たらこのようにContact Form 7に関するものが差し込まれてます。
これが全ページに表示されてしまってるんですね。コンタクトフォームに関するものなのでコンタクトフォームを設置したページにのみ表示されていれば良いんです。
無駄なソースによって表示が遅くなるなどの影響が出る可能性がありますしね。サイトの高速化のためには無駄なものは消した方が良いんです。
というわけで、まずすべてのページからこの記述を消し、コンタクトフォームを設置したページにだけその記述を戻すという手順でやってみます。
functions.phpに2行追記してCSSとJavascriptの記述を消す
デフォルトでは全ページにContact Form 7に関するCSSとJavascriptが表示されるようになってしまってるので、これを消しましょう。
やることは簡単で、functions.phpに下記の2行を追記するだけ。
add_filter( 'wpcf7_load_js', '__return_false' ); add_filter( 'wpcf7_load_css', '__return_false' );
これですべてのページでContact Form 7用のCSSとJavascriptが表示されなくなりました。
コンタクトフォーム用のページにのみ追記
先ほどの作業でコンタクトフォームを設置したページにも表示されなくなってます。
ここで改めてコンタクトフォームを設置したページにのみContact Form 7用のCSSとJavascriptを表示させましょう。
下記の記述を今度はheader.phpのheadタグ内に記述してください。場所はどこでもいいんですが、style.cssの前後がいいと思います。
<?php if( is_page( 'contact' ) ): ?> <link rel="stylesheet" href="<?php echo plugins_url(); ?>/contact-form-7/includes/css/styles.css" id="contact-form-7-css"> <?php endif; ?>
1行目で「固定ページのcontactというスラッグのページのみ」という条件で分岐させてます。もしお問い合わせフォームのページが「support」というスラッグであればcontactをsupportにする、という具合にご自身の環境に合わせてくださいね。
2行目はでWordPressのプラグインフォルダまでのパスを記述してます。絶対パスで書いてももちろん大丈夫ですが、上記のように書いておけばコピペで使えますので、ぜひこのまま持っていってください。
もしページが複数あるようならこちら。3ページ以上であれば1行目にうまいこと書き加えてください。
<?php if( is_page( array( 'contact' , 'reserve' ) ) ): ?> <link rel="stylesheet" href="<?php echo plugins_url(); ?>/contact-form-7/includes/css/styles.css" id="contact-form-7-css"> <?php endif; ?>
functions.phpだけに書く方法も
上記の手順でdelaymaniaに実装した後に見つけたんですけども、header.phpに書かなくてもfunctions.phpに書くだけで解決する方法がありました。こちらの方が楽かもしれません。
function wpcf7_file_control()
{
add_filter("wpcf7_load_js", "__return_false");
add_filter("wpcf7_load_css", "__return_false");
if( is_page("contact") ){
if( function_exists("wpcf7_enqueue_scripts") ) wpcf7_enqueue_scripts();
if( function_exists("wpcf7_enqueue_styles") ) wpcf7_enqueue_styles();
}
}
add_action("template_redirect", "wpcf7_file_control");
最後に
おそらく他のプラグインでも応用が効くと思います。
気になる方はぜひお試しください。