WordPressでプラグインのJSとCSSファイルを必要ページ以外で読み込まないようにする方法

今回は「Contact Form 7」と「Skitter Slideshow」の場合をご紹介します。
応用したら他のプラグインでもいけるんじゃないかなーと思います。

「Contact Form 7」の場合

通常、「Contact Form 7」を使用すると、以下のファイルが<head>で読み込まれます。

  • plugins/contact-form-7/includes/css/styles.css
  • plugins/contact-form-7/includes/js/jquery.form.min.js
  • plugins/contact-form-7/includes/js/scripts.js

「Contact Form 7」はメールフォーム用のプラグインですので、メールフォームがないページには不要です。そのため、必要なページ以外では読み込まないようにしたいと思います。

function.phpに記述

メールフォームを設置しているページURLが「(サイトURL)/contact」の場合。

remove_action( 'wp_enqueue_scripts', 'wpcf7_enqueue_scripts' );
remove_action( 'wp_enqueue_scripts', 'wpcf7_enqueue_styles' );
if ( $_SERVER['REQUEST_URI'] == "/contact/" ) {
    add_action( 'wp_enqueue_scripts', 'wpcf7_enqueue_scripts' );
    add_action( 'wp_enqueue_scripts', 'wpcf7_enqueue_styles' );
}

urlが”/contact”の時のみ読み込むようになります。

「Skitter Slideshow」の場合

あまりない例だとは思いますが、「Skitter Slideshow」で使用する「jquery.easing.1.3.js」と他のプラグインがぶつかってしまったことがあります。
この場合、「Skitter Slideshow」はトップページでのみ使用できればよかったので、トップページ以外では読み込まないようにして、他のプラグインとぶつからないようにしました。

「jquery.easing.1.3.js」を<heade>で読み込んでいるのは、wp-skitter-slideshow/wp-skitter-slideshow.phpファイルの大体32行目、84行目のあたりでした。この部分をトップページ以外では読み込まないようにしたいと思います。

32行目あたり

add_action('init', 'init_load');

84行目あたり

/** 
 * Load scripts 
 */
function init_load()
{
    wp_enqueue_script('skitter', WP_PLUGIN_URL . '/wp-skitter-slideshow/js/jquery.skitter.min.js', array('jquery'));
    // wp_enqueue_script('jquery.animate-colors', WP_PLUGIN_URL . '/wp-skitter-slideshow/js/jquery.animate-colors-min.js', array('jquery'));
    wp_enqueue_script('jquery.easing', WP_PLUGIN_URL . '/wp-skitter-slideshow/js/jquery.easing.1.3.js', array('jquery'));
    wp_enqueue_style( 'skitter.styles', WP_PLUGIN_URL . '/wp-skitter-slideshow/css/skitter.styles.min.css');
}

function.phpに記述

remove_action( 'init', 'init_load' );
if ( $_SERVER['REQUEST_URI'] == "/" ) {
    add_action('init', 'init_load');
}

urlが"/"(トップページ)の時のみ読み込むようになります。
この"/"が"/hogehoge/"の場合は、「サイトURL」/hogehogeの場合のみ読み込むようになります。

「Contact Form 7」と「Skitter Slideshow」、どちらも手順としては

  1. 「remove_action」でファイルを読み込まないようにする
  2. ifで指定したURLと開いたページURLが合致した場合にファイルを読み込む

という手順となっています。
他のプラグインでもぜひ応用してみてください。