Shopifyで複数モーダルを作る方法

Shopifyのレイアウト変更で役立つセクション追加機能に、複数のギャラリー画像やカードをクリックすると、その要素に紐付けられたモーダルを表示できるようにした。

JavaScriptで作ります

完成イメージ

PC

モバイル

ショップオーナーさんにも優しいカスタマイズ

ショップオーナーさんでお好みの画像や見出し、説明、ボタンの色やリンクを自由に設定できるようにしました。


 

Dawnテーマをベースに作成。コピペで使えるテンプレートコードはnoteにまとめました。設置方法も載せてます。コピペで使えるテンプレートなので、HTML・CSSがわからなくても使えます。

 

 

 

私はこのスキルを身につけて不労所得を得ています

【Web開発初心者向け!】Web開発入門完全攻略 充実の18時間コース

未経験からプロのWebデザイナーになる! 400レッスン以上の完全マスターコース

HTML/CSSだけで自動収益化 1万円達成

関連記事

HTML/CSSだけで自動収益化 月1万円達成

Progate(プロゲート)完了したら何したらいい?

[Python] Tweepyのme()でエラー出た時の解決法

[Flutter]実機でデバッグしてみる(Android編)

[Shopify]請求書・納品書などの明細書を作成する方法(テンプレート情報有)

[Flutter]実機で検証する方法(iOS編)