WordPressでcontact form7を導入したら一部のjqueryが動かなくなった

Question

表題の通りです。

プラグインを停止した場合は問題なく動きます。

理由や原因等ご存知の方いらっしゃいましたら教えてください。

よろしくお願い致します。

↓動作しないコード

jQuery(function($){
  var $target = $('.link-btn');
  var bgColor = $target.css('background-color');
  var hoverColor = 'rgb(46, 46, 46)';
  var speed = 300;
  var easing ='linear';

  $target.hover(function(){
    $(this).stop().animate({
      backgroundColor: hoverColor
    }, speed, easing);

  },function(){
    $(this).stop().animate({
      backgroundColor: bgColor
    }, speed, easing);
  });
});

Comments

[Bernadotte]

記述のソースを見ればどういった役割を負ったコードかは理解できますが、
プラグインやWPのverを記述するやら調べられたことを掲載するとかないと、問題の丸投げでしかありません。

Answer 1

プラグインを有効化したらjQueryのコードが動かなくなった場合は
１、jQueryが２回読み込まれていないか確認
２、そのコードがjQueryより前に実行されていないか確認

この原因は大体wp_enqueue_scriptを使わずにjqueryを読み込んだり
依存関係をちゃんと書かずにwp_enqueue_scriptをしている場合です

head内にscriptタグを直接書いてjqueryを読み込んだりしていると
jqueryを使うプラグインがscriptタグの優先順位を解決できず問題が起きます
jqueryの読み込みはwp_enqueue_scriptでやるようにしましょう

依存関係をちゃんと書かずにscriptタグの出力をなすがままにしていると
依存関係をちゃんと書いたwp_enqueue_scriptが実行されることで
意図しない順番でscriptタグが出力されるようになります
wp_enqueue_scriptには必要な依存関係を書くようにしましょう