プログラミング

WordPressのjQueryを解除して独自のjQueryファイルを読み込む方法【WordPressカスタマイズ】

WordPressでは標準でjQueryが読み込まれていますが、標準のjQueryを解除して独自のjQueryファイルを読み込ませたい時があります。

// functions.phpに以下を記述
function add_my_scripts() {	
  //WordPress 本体の jQuery を登録解除
  wp_deregister_script('jquery');  
  //jsファイルを全て読み込む
  wp_enqueue_script(
    'jquery', 
    get_stylesheet_directory_uri().( '/js/jquerr_org.js' ), 
    array(), 
    false, 
    false
  );
}
add_action('wp_enqueue_scripts', 'add_my_scripts');

?>

get_stylesheet_directory_uri().( 〜〜)の部分でファイルのパスを指定します。CDNを以下のように記述し読み込ませることも可能です。

wp_enqueue_script(
    'jquery', 
    'https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js', 
    array(), 
    false, 
    false
  );

「ローカルでは動いていたのに、本番環境にアップしたらjQueryが動かない!」ということがあり、調べたらどうやらWP標準のjQueryが邪魔をしていたようです。

<head></head>内に直接記述することもできますが、以上のようにwp_enqueue_scriptを使用して読み込むことが推奨されています。

ABOUT ME
マッチ
マッチ
サラリーマンをしながら筋トレブログを2020年1月より運営。 体型に自信が持てないあなたへ、筋トレの魅力を発信中。 趣味はアジア旅で訪問国は20カ国以上。