wordpress(lightning)にswiper.jsを読み込めない。
解決したいこと
wordpress(lightning)にswiper.jsを読み込んで、スライドを実装したいです。なぜかエラーが出てしまうため、解決方法を教えていただきたいです。
発生している問題・エラー
ReferenceError: jQuary is not defined
または、問題・エラーが起きている画像をここにドラッグアンドドロップ
該当するソースコード
カスタムHTML内記載のjavascrptのコードです
<script>
jQuary (function(){
const mySwiper = new Swiper('.swiper', {
// Optional parameters
loop: true,
centeredSlides: true,
slidesPerView: 1,
breakpoints: {
// スライドの表示枚数：500px以上の場合
600: {
slidesPerView: 2,
},
1024: {
slidesPerView: 3,
},
},
// If we need pagination
pagination: {
el: '.swiper-pagination',
},
// Navigation arrows
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev',
}
});
});
</script>
header.php
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.css"
/>
</head>
footer.php
<script src="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.js"></script>
</body>
自分で試したこと
①header.phpにswiper.jsのcssを読み込む、
②footer.phpにjavascriptを読み込む
③固定ページのカスタムhtmlにてhtmlとcss,javascriptを記述。
①②は上記で貼り付けたコード以外はいじっていません。
また、lightningのheader.php/footer.phpそれぞれg2,g3といくつか合ったので、全てに記載しているのですが、それが間違っているのでしょうか？
https://tamatuf.net/wordpress/wordpress-swiper/
↑の記事を参考にしました。
ご回答いただけますと幸いです。よろしくお願いいたします。
0 likes
