# イメージセレクターセクション ### **学べること** * 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）に当社ウェブサイトで直接対応 --- # Agent Instructions: Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter: ``` GET https://docs.openspaces.design/english-ja/readme-1/sections-and-features/image-selector-section.md?ask= ``` The question should be specific, self-contained, and written in natural language. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.