WebDesign Dackel

Contact Form 7のJS/CSSのファイルを必要な場合のみ読み込む

Contact Form 7のJS/CSSのファイルを必要な場合のみ読み込む

Hatena0
Google+0
Pocket0
Feedly0

WordPressを使ったサイト制作の時に大変お世話になっている「Contact Form 7」ですが、デフォルトでは全てのページにプラグイン用のCSS、JSを読み込んでしまいます。
ページの高速化を考えると、出来るだけ余計なファイルを読み込みたくないので調べてみたら、プラグインの公式サイトで方法の紹介があったので試してみました。

前提

このブログではContactForm7を使っているのは/contact/の1ページだけです。
なので、このページに対してのみJSとCSSを読み込むようにしたいと思います。

ソースコード

functions.phpに数行コードを書くだけで実現出来るみたいです。
記載したコードは以下。

// contact form 7 のファイルを必要な場合のみ読み込む
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");

is_page()を使って、ページのスラッグ名がcontactの場合のみ必要なファイルを読み込む様にしています。
これで、トップページや詳細ページなどのページでContactForm7用の余計なファイルが読み込まれなくなりました。

参考サイト

必要な場合だけ JavaScript とスタイルシートをロードさせるには | Contact Form 7 [日本語]

他にも調整したい部分があれば、公式サイトを見るのが間違いなさそうですね。