# Classic Collection

### 学べること

* コレクションページでクラシックコレクションセクションを有効化および設定する方法
* 組み込みの製品並び替え機能の使い方
* スタイルとラベルの調整方法

<figure><img src="/files/b06a0fcbe8db7e9470d6e36a70dc9127cbebe0bc" alt=""><figcaption></figcaption></figure>

***

### 1. クラシックコレクションセクションを追加する

1. Shopify管理画面で、次に移動します **オンラインストア > テーマ**.
2. クリック： **テキストの** アクティブなテーマの上で。
3. から **コレクション** ページテンプレートで、次を追加します **Classic Collection** セクション。

> 💡 ヒント: このセクションは並び替え、製品ラベル（予約注文、セール中、在庫切れ）および詳細な表示設定をサポートします。

***

### 2. 並び替えオプションを追加して設定する

「おすすめ」「価格の安い順」「新着順」など複数の並び替えタイプを追加できます。

#### 手順:

1. 内の **Classic Collection** セクション設定で、新しい **並び替えオプション** ブロックを追加します。
2. 各項目について:
   * を設定する **オプションタイトル** （ユーザーが目にする表示）
   * を選択 **並び替え基準** の方法（例: おすすめ、価格、日付）

***

### 3. コレクションレイアウトのスタイル設定

クラシックコレクションセクションはレイアウトやタイポグラフィの多くのオプションを提供します：

#### カート＆ヘッダー設定：

* 日付/時刻の切り替え
* カートアイコンの色を設定

#### コレクションメニュー：

* メニューの位置と配置
* リンクの間隔とフォントサイズ
* メニューの色（ホバー、サブメニューなど）

!\[スクリーンショットのプレースホルダー - コレクションメニューのスタイリング]

#### 商品タイトルと価格：

* フォントサイズと色
* 比較価格のスタイリング
* 通貨表示形式の切り替え

***

### 4. ラベルの管理

商品ラベルの表示/非表示や見た目を変更できます：

* **予約注文**
* **セール中**
* **在庫切れ**

ラベルの背景色、文字色、フォントサイズを調整できます。

***

### 5. 背景とアイコン

セクションの視覚的な見た目を制御します：

* 商品の背景色と角丸（ボーダー半径）
* 検索および並び替えアイコンの色と配置

***

### 6. ページネーション設定

の選択： **無限スクロール** または **ページネーション** とナビゲーション要素のスタイル設定：

* 現在のページの色を設定
* 矢印アイコンやフォントをカスタマイズ

### **ヘルプが必要ですか？**

* 💬 **Discordでコミュニティに参加：** <https://discord.gg/hcc2GvgZc6>
* 📧 **メールでお問い合わせ：** <support@openspaces.design>
* 💻 **ライブチャット：** 月〜金、現地時間午前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/pages-and-menus/collection-page/classic-collection.md?ask=<question>
```

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.
