WordPressでjQeryプラグインvegas2の実装

Question

WordPressでjQeryプラグインvegas2の実装

jQueryでvegasを実装しています。
WordPressでwelukaプラグインを使用し、vegasを実装したところ、
下記のエラーメッセージがでました。

<script> $(function(){ $('body.page-id-6').vegas({ ←エラーが出ている箇所 slides: [ { src: 'https://apis-glass.com/img/slide1.jpg' }, { src: 'https://apis-glass.com/img/slide2.jpg' }, { src: 'https://apis-glass.com/img/slide3.jpg' } ], transition: 'slideLeft2', }); }); </script>

$('body.page-id-6')の箇所を
$('body')に変更したらトップページ以外にはスライドが表示されました。

Uncaught TypeError: $(...).vegas is not a function

試したこと

welukaプラグインのカスタマーサポートで質問をしてみました。

【返答】
////////////////////////////////////////////////////////////////
WordPressでは通常のｊＱｕｅｒｙでの$は標準的な書き方だと使用できません。
＄をｊＱｕｅｒｙに置き換えることで可能です。
例）ｊＱｕｅｒｙ（ ’ｂｏｄｙ．ｈｏｍｅ’ ）．ｖｅｇａｓ（｛｝）；

補足：
下記の様なブロックで囲むと ブロック内では＄が使用可能になります。
ｊＱｕｅｒｙ（ｄｏｃｕｍｎｔ）．ｒｅａｄｙ（ｆｕｎｃｔｉｏｎ（＄）｛
/* 処理 */
｝
////////////////////////////////////////////////////////////////

この通り試してみましたが、実装できませんでした。
独学でやっているので、どなたか詳しい方、知恵をお貸し下さい。

宜しくお願いいたします。

補足情報（ツールのバージョンなど）

・WordPress 4.9.3
・weluka バージョン 1.2.5

Comments

[kszk311]

一応確認ですが、vegasのJS自体は、jQueryの読み込みのあとに読み込んでいますか？

[s-y7745]

ご返信ありがとうございます。そうしています。

Answer 1

welukaとかこのサイトのテーマでしょうか？
https://www.weluka.me/

現物がないのでデモサイトのソースをコピーして動かしてみたら以下のコードで問題無く動きました。

<script>
jQuery(function(){
jQuery('body.postid-1').vegas({
slides: [
{ src: 'https://apis-glass.com/img/slide1.jpg' },
{ src: 'https://apis-glass.com/img/slide2.jpg' },
{ src: 'https://apis-glass.com/img/slide3.jpg' }
],
transition: 'slideLeft2',
});
});
</script>

$('body')に変更したらトップページ以外にはスライドが表示されました。

との事ですが全ページの間違いではないでしょうか？
とりあえず自分が確認したidclassはpostid-1となっていたのでpage-id-6'とされているのでpageとidの間の-が要らないのではないでしょうか？

Comments

[s-y7745]

ご返信いただき、ありがとうございます。
一度検証してみます。