jQueryの読込み順序に気をつけよう！！

こないだwordpressに組込んだプラグインが動かなくて、
長時間悩んで、あれこれやった末にやっと解決したのでその覚書き。

結果として『jQueryの読込み順序』が原因でした。。。

みなさんの中で組込んだJavaScriptが動かないよ〜＞＜と悩んでましたら、
解決のお役に立てれればと思います(^^)

どうなっていたかと言いますと。
当初下記のようにテンプレートのhead内に記述がありました。

〜略〜
<?php wp_head(); ?>
<script src="<?php bloginfo('template_url'); ?>/js/jquery1.4.4.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
〜略〜

この状態で、今回入れたギャラリープラグインの機能のLightBoxが動かず。。orz
他のプラグインを止めてみたり、wordpressをバージョンアップしてみたり、
プラグインのバージョンを上げたり下げたりせども解決せず。。。はぁ。。泣

こうなったらWebインスペークターでじっくりソースを見る。。。う〜ん

<?php wp_head(); ?>

このwp_headはなにを吐き出してるのかなと見てみると、
プラグインのJavaScriptやCSSを吐き出しているよう。

この中に下記の記述が

<script type='text/javascript' src='<?php bloginfo('template_url'); ?>/js/jquery/jquery.js?ver=1.11.3'></script>

当初のソースだと下記のようになっていた。

〜略〜
<script type='text/javascript' src='<?php bloginfo('template_url'); ?>/js/jquery/jquery.js?ver=1.11.3'></script>
<script src="<?php bloginfo('template_url'); ?>/js/jquery1.4.4.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
〜略〜

これを

〜略〜
<script src="<?php bloginfo('template_url'); ?>/js/jquery1.4.4.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type='text/javascript' src='<?php bloginfo('template_url'); ?>/js/jquery/jquery.js?ver=1.11.3'></script>
〜略〜

のように、新しいバージョンjquery.js?ver=1.11.3を、最後に読み込むように変更したところ

無事解決(^^)b

当初のだと新しいバージョンのjqueryを読み込んでから、
そのあと古いバージョンのjqueryを読み込んでいたので、
何かが古いバージョンに書き換えられてしまってたのかなと思います。

どうしてもJavaScriptが動かなかったら順序も気にしてみてください(^^)

ではでは。