【ワードプレス】wp_enqueue_scriptでjQueryを読み込む2つの書き方。

ワードプレスのテーマ制作において、

functions.phpでjQueryを読み込む方法は本によってwp_enqueue_script(‘jquery’)とかarray(‘jquery’)とか、書き方がバラバラだったりするんですよね。

特に、先にjQuery本体を読み込んでから自分が作ったjQueryファイルを読み込みたい場合、「どう書けばいいの?」ってなりますよね。

それについて書いていきます。

【ワードプレス】wp_enqueue_scriptでjQueryを読み込む2つの書き方。

結論からいうと

  • wp_enqueue_script(‘jquery’)
  • array(‘jquery’)

どちらの書き方も正解です。

例えばjQueryと自分のJavascriptファイルを読み込みたい場合は


wp_enqueue_script('jquery');  //WordPress内臓のjQueryの読み込み
wp_enqueue_script(
  'main',  //ハンドル名
  'esc_url(get_template_directory_uri.........)',  //ファイルのパス
  array(),  //依存関係
  true
);

でいいです。

jQueryとJavascriptなので、先にjQueryを読み込む必要はないので別々に読み込んで大丈夫です。

ただしにJavascriptではなく自分のjQueryファイルを読み込みたい場合は、先にjQueryを読み込む必要があるので、


wp_enqueue_script(
  'main',  //ハンドル名
  'esc_url(get_template_directory_uri.........)',  //ファイルのパス
  array('jquery'),  //依存関係 WordPress内臓のjQueryの読み込み
  '1.0',  //バージョン
  true  //読み込み位置
);

と書きます。

array(‘jquery’)と書けば、ついでにワードプレス内臓のjQueryを読み込んでくれます。

わざわざwp_enqueue_script(‘jquery’);と書く必要はありません。

ワードプレスでjQueryが効かない。

「ワードプレスでjQueryが効かない」という方へ。

実は、WordPressではjQueryの$マークは使えないようになっています。他の機能と衝突するのを避けるためです。

ではどうすればいいかというと、$のところをjQueryに変えるだけです。

もしくは全体をjQuery(function($)){});で囲むか。←こっちのほうが手間が少なくていいです。

参考↓

【楽に解決!】WordPressのjQueryを使う方法と動かない時の解決策!プラグイン導入方法も | Briar Patch

以上です。

タイトルとURLをコピーしました