# イメージセレクターセクション ### **学べること** * 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でコミュニティに参加：** * 📧 **メールでお問い合わせ：** * 💻 **ライブチャット：** 月〜金、現地時間午前10時〜午後6時（EST）に当社ウェブサイトで直接対応