FROM CACHE - jp_header

写真をクリックしてメイン画像を切り替えたい

Kite
Shopify Partner
9 0 1

お世話になっております。

 

通常ページで写真を追加し、その下に他の写真を小さく表示し、メイン画像が切り替えられるようにしたいのですが、実装方法をご教示いただきたいです。

コードに関しては下記のサイトを参考にし、jQueryの追加を試みたのですが、うまく反映されない状況です。(サイト内に画像表示の見本あり)

https://junpei-sugiyama.com/thumbnail-switching-image/

 

使用テーマ:Focal

 

お力をお借りできますと幸いです。

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

 

 

 

 

2件の返信2

株式会社フルバランス
Shopify Partner
1513 544 681

Kite様

 

ご質問を確認いたしました。

 

参考サイトを見たところ、問題なく画像の切り替えができているようでした。

お困りのポイントとしては、jqueryがうまく読み込めない、ということでしょうか?

 

jqueryの読み込み方は、以下のページを参考にされると良いかと存じます。(Dawnと書いてますが、どのテーマでも手順は同じです。)

https://note.com/tech_malin/n/nebe055299b09

 

手軽に画像切り替えを実装されたい場合は、「slick」を使用されることをおすすめします。

https://kenwheeler.github.io/slick/

 

ご参考までに。
 
私たちの励みにもなりますので、
お役に立てていればBest Answerボタンを押して頂ければ嬉しいです。
 
分からない点があれば、またいつでもご連絡ください。
 
フルバランス 園畑

株式会社フルバランス(Shopify Experts)
Shopify専門のEC成長支援会社です。ストアの新規構築から運用や改善のサポートなどShopifyに関する幅広いサービスを行なっております。
ECの技術・実務・成長、お悩みのことがあれば、お気軽にご相談ください。
『すべてのブランドの特大成長エンジンを搭載する』 株式会社フルバランス
Kite
Shopify Partner
9 0 1

株式会社フルバランス 園畑様

メッセージいただき本当にありがとうございます!!

取り掛かるのが遅くなってしまったのですが、ご教授いただいた方法でjqueryの設定を行いました!

また、初歩的なご質問で恐縮なのですが、教えていただいた「slick」を活用したいのですが、こちらのコードはどこに記載すべきか教えていただけますでしょうか。

写真の切り替えは、新しく作成するページテンプレートに反映させたいと考えています。

重ね重ね申し訳ございませんが、ご確認いただけたら嬉しいです。。