jsファイルの読み込み
wordpressでjQueryを読み込む方法はいくつかありますが、ここではheadタグ内で数行書き加えるだけの方法を紹介します。
<?php wp_deregister_script(‘jquery’); ?>
このコードをheadタグのjsファイルをを読み込む前に記述します。
<!doctype html>
<html lang="ja">
<head>
<meta charset="UTF-8">
.
.
.
<?php wp_deregister_script('jquery'); ?><!-- ここです -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</head>
次に<script>タグも<?php echo get_template_directory_uri(); ?>による記述に変えてあげましょう。
<!doctype html>
<html lang="ja">
<head>
<meta charset="UTF-8">
.
.
.
<?php wp_deregister_script('jquery'); ?>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="<?php echo get_template_directory_uri(); ?>/js/main.js"></script><!-- ここです -->
</head>
最後にheadタグ直前に<?php wp_head(); ?>を記述して準備完了です。
<!doctype html>
<html lang="ja">
<head>
<meta charset="UTF-8">
.
.
.
<?php wp_deregister_script('jquery'); ?>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="<?php echo get_template_directory_uri(); ?>/js/main.js"></script>
<?php wp_head(); ?><!-- ここです -->
</head>
jsファイルの書き換え
これだけではまだjQueryは動きません。
jsファイル自体を書き換えてあげる必要があります。
プラグインを実行させるためのコードや、ちょっとしたイベント等自分で書いたjsファイルの「＄」を「jQuery」に書き換えます。
$(function(){
....
});
//下記に書き換えます
jquery(function(){
....
});
以上の作業でjQueryを実行することができます。
まとめ
wordpressにはjQueryが動作する環境が元々備わっています。（ツールバーが最初から装備されているのもそういうことです。）
<?php wp_deregister_script(‘jquery’); ?>が何をしたかというと、この標準装備のjQuery環境と競合しないようにwordpress自体のjQuery環境を停止させたのです。
なので、当然ながらjqueryの読み込みファイルもお忘れなく！
