イメージセレクターセクション

学べること

• Image Selector セクションの追加方法と設定方法

• 画像のアップロード方法とそれらを商品、ページ、またはコレクションにリンクする方法

• モバイルとデスクトップ向けのスタイルをカスタマイズする方法

• テキストサイズ、インジケーターのスタイル、レイアウトを制御する方法

---

🧩 セクション概要

Image Selector セクションでは、顧客がクリック可能な画像の一連を切り替えて表示できます。異なる商品ルック、色のバリエーション、または注目のコレクションを紹介するのに最適です。

各画像はオプションのテキストとクリック可能な URL を持つ視覚的なリンクのように機能します。

---

⚙️ Image Selector の追加とカスタマイズ方法

1. セクションを追加する

• 「 Shopify テーマエディタ」で、クリック 「セクションを追加」

• を選択します Image Selector

• レイアウト内の適切な場所にセクションをドラッグしてください

---

📷 スライド（画像）の追加方法

各画像は次のように追加されます スライド ブロック。

スライドを追加するには：

1. クリック： スライドを追加

2. 画像をアップロード

3. （オプション）追加：

   • リンクテキスト: 画像の下に表示されます

   • リンク URL: 商品、コレクション、または任意のリンクを貼り付けてください

💡 ヒント：空白のままにすると、画像のみのクリーンなレイアウトになります。 リンクテキスト

---

🎨 デザインとスタイルのオプション

の下で、 Image Selector 設定をカスタマイズ：

色

• 背景色: 塗りつぶしまたはグラデーションを選択

• リンクカラー: 各画像の下のテキストに影響します

• インジケーター枠線カラー: 選択された画像のアウトラインカラー（サムネイルナビで表示）

タイポグラフィ

• リンクテキストサイズ（デスクトップ）: で調整可能 px

• リンクテキストサイズ（モバイル）: で調整可能 px

• リンクテキストの太さ: 切り替え： レギュラー および ボールド

💡 ヒント：異なるコレクションを強調する場合は、太字かつ大きめのテキストを使用してください。

---

🧩 セクショントリーの例

Image Selector
├── スライド – ルック 1
├── スライド – ルック 2
├── スライド – ルック 3
├── スライド – ルック 4
├── スライド – ルック 5
└── スライド – ルック 6

---

ヘルプが必要ですか？

• 💬 Discordでコミュニティに参加： https://discord.gg/hcc2GvgZc6

• 📧 メールでお問い合わせ： [email protected]

• 💻 ライブチャット： 月〜金、現地時間午前10時〜午後6時（EST）に当社ウェブサイトで直接対応