オープンソース · Rufo

Contact Form 7を、
必要な場所だけに。

Rufoは、フォームのないすべてのページから、Contact Form 7の未使用のCSSとJavaScriptファイルを自動的に削除します。WordPress.orgで無料で入手できます。

課題

500万のサイト。
すべてのページが遅くなる。

Takayuki Miyoshi氏が開発したContact Form 7プラグインが、500万以上のWordPressサイトで使われていることをご存じですか？長年にわたり、WordPressのお問い合わせフォームの定番として選ばれてきました。機能が豊富で、とても使いやすいプラグインです。しかし、速度の面では大きな問題があります。Contact Form 7は、お問い合わせフォームがないページも含め、サイトのすべてのページにCSSとJavaScriptファイルを読み込みます。ファイル自体は大きくありませんが、それでもサイトの表示を遅くします。誰もがサイトの高速化に取り組んでいる今、これは見過ごせない問題です。

Rufoの役割

ファイルは、フォームのある場所だけに。

/contactContact Form 7のフォームあり

CF7ファイルを読み込み

/blog, /about, /shop …ページにフォームなし

削除

自動。設定は不要です。

インストール

1分で使い始められます。

WordPressの管理画面にログインします。
左側のメニューからプラグインを開きます。
新規プラグインを追加をクリックします。
「Rufo」を検索します。
インストールして有効化します。これで完了です。

アンインストールするには、無効化して削除するだけです。Rufoはサイトのデータベースやその他のリソースを一切使用しません。

WordPress.orgからダウンロード

ガイド

コードで対応したい方へ。仕組みをご紹介します。

フォームのないページでContact Form 7のファイルを読み込ませない2つの方法。

問題がわかったところで、解決策を見ていきましょう。お問い合わせフォームのないページからこれらのファイルを削除する方法は2つあります。

方法1：カスタムPHPコード

カスタムPHPコードを作成し、テーマのfunctions.phpファイルに追加する方法です。このコードにより、お問い合わせフォームのないページではContact Form 7のファイルを読み込まないようWordPressに指示できます。

ただし注意が必要です。今後アップデートされる可能性のあるテーマを編集する場合は、子テーマを使用することをおすすめします。そうすれば、親テーマをアップデートしても変更内容が失われません。

これには2つの方法があります。

方法1、A. ページ情報を直接指定する

お問い合わせフォームのあるページのIDがわかっている場合は、このコードを使用できます。指定したIDのページ以外では、Contact Form 7のファイルを読み込まないようWordPressに指示します。

if ( !is_singular() && get_the_ID() != 65 ) {
        add_filter( 'wpcf7_load_js', '__return_false' ); 
        add_filter( 'wpcf7_load_css', '__return_false' );
}

IDが65と99の複数のページにお問い合わせフォームがある場合：

if ( !is_singular() && !in_array(get_the_ID(), [65,99]) ) {
        add_filter( 'wpcf7_load_js', '__return_false' ); 
        add_filter( 'wpcf7_load_css', '__return_false' );
}

IDの代わりにページのスラッグを使用する場合。

if ( !is_singular() ) { 

    $page_slug = get_post_field( 'post_name', get_queried_object_id() );
    $excluded_slugs = ['example-page-slug-1', 'example-page-slug-2']; 
    
    // Add your excluded slugs here 
    if ( !in_array($page_slug, $excluded_slugs) ) { 
          add_filter( 'wpcf7_load_js', '__return_false' ); 
          add_filter( 'wpcf7_load_css', '__return_false' ); 
    } 
}

方法1、B. ページのコンテンツからお問い合わせフォームのショートコードを検出する：

このコードは、ページのコンテンツにContact Form 7のショートコードが含まれているかを確認します。ショートコードが見つからない場合、そのページではCSSとJavaScriptファイルを読み込みません。

function globaliser_page_has_contact_form() 
     {

        global $post;

        if ( is_singular() ) 
        {
           $content = $post->post_content;   
           if ( has_shortcode( $content, 'contact-form-7' ) ) 
           {
             return true;
           }
        }
        return false;
     }


     if ( !globaliser_page_has_contact_form() ) 
     {
         add_filter( 'wpcf7_load_js', '__return_false' ); 
         add_filter( 'wpcf7_load_css', '__return_false' );
     }

方法2： Rufo WordPressプラグイン

コードを触りたくない場合もご安心ください。代わりにRufo WordPressプラグインを使用できます。この便利なツールは、お問い合わせフォームのないページを自動的に検出し、不要なCSSとJavaScriptファイルを削除します。カスタムコードを書くよりも、シンプルで使いやすい解決策です。

上記の2つ目の方法と同じ処理を行い、お問い合わせフォームのないページからCSSとJavaScriptファイルを自動的に削除します。

なぜコードではなく、プラグインを作ったのでしょうか。Contact Form 7プラグインを直接編集するよう勧める人もいますが、WordPressの世界ではそれは良い方法ではありません。

また、オンラインで調べたところ、ほかの解決策もコードの追加を勧めるものばかりでした。そこで、誰もが、特に技術に詳しくない方でも簡単に使えるよう、このプラグインを開発しました。

また、MVCという洗練されたアーキテクチャで独自のWordPressプラグインを開発することに興味がある方には、それを支援するATAというプラグインもご用意しています。ただ、それはまた別の機会にお話しします。

次の成功事例は、あなたかもしれません。

ご不明な点はありませんか？最適な一歩を踏み出せるよう、私たちがサポートします。

お問い合わせ無料の速度診断 ›

Contact Form 7を、必要な場所だけに。

500万のサイト。すべてのページが遅くなる。