search

サイドバー コレクション

Plain Jane および Plain Jane Interactive 向け

hashtag
学べること

  • サイドバー コレクション セクションの設定方法

  • カート、メニュー、商品、ラベルの設定を調整する方法

  • 並び替え、検索、ページネーションの動作を有効にする方法

hashtag
サイドバー コレクションのカスタマイズ方法

  1. テーマ エディタに移動する

    • Shopify管理画面から、 オンラインストア > テーマ

    • クリック： テキストの 現在有効なテーマで

    • を開く コレクション テンプレートを開き、を選択する サイドバー コレクション セクション

  2. サイドバー メニュー

    • クリック： を選択します メニューを割り当てるには

    • サイドバーの位置をに配置する 左 または 右

    • オプションで スキン画像をアップロードする 背景をカスタマイズするために

  3. サイドバー設定

    • 調整: サイドバーの不透明度 スライダーを使用して（例: 1 px）

    • を設定する 背景色 （例: #202020)

    • 切り替え： 固定メニューを有効にする または サイドバーの影を有効にする 必要に応じて

  4. 日付と時刻（オプション）

    • テキストの 日付/時刻の色 デスクトップとモバイル用に

    • 切り替え： 日付/時刻を表示 タイムスタンプを表示するために

  5. サイドバーリンク

    • 設定する： テキストの配置 （左、中央）

    • の間隔を調整する リンクレベル および フォントサイズ

    • 色をカスタマイズ：

      • メニュー＆カートリンクの色

      • カートのテキスト, 数量、および 背景 色

      • モバイルの色 含まれる

  6. 商品タイトルと価格

    • テキストの フォントサイズ および テキスト色 タイトルと価格のための

    • 設定する： 比較価格の色 （例: 赤 #FF0000)

    • 表示オプションを切り替える：

      • 商品タイトルを表示

      • 商品価格を表示

      • 比較価格を表示

  7. ラベル

    • フォントサイズと背景/テキスト色を設定：

      • 予約注文

      • セール中

      • 在庫切れ

    • 各ラベルタイプの表示/非表示を切り替える

  8. 商品背景

    • 設定する： 角の半径 および 背景色

    • オプションで背景を透明にする

  9. 検索＆並べ替えアイコン

    • アイコンの位置を設定 位置 および 色

    • の表示/非表示を切り替える 検索/並べ替えアイコン および アイコンを入れ替える

  10. 検索バー

    • 調整: 背景の不透明度 および 色 対象：

      • 検索ボックス

      • キャンセルボタン

      • 検索結果

      • 入力フィールド

    • 角や影をオプションでスタイル設定する

  11. 並び替えメニュー

    • カスタマイズ：

      • デフォルトとアクティブなオプションのテキストと背景色

      • 並び替えメニューのハンドルの色

  12. ページネーションと読み込み

    • を選択 ページネーションの種類: 無限スクロール または ページ番号

    • 次の色を設定：

      • ページネーションのテキスト

      • アクティブなページとそのテキスト

      • ページネーションの矢印

💡 ヒント: スペーシング、可読性、レイアウトの整合性を確認するために、デスクトップとモバイルの両方でプレビューすることを忘れないでください。

hashtag
ヘルプが必要ですか？

前へClassic Collection次へコレクションリストページ

最終更新