# レイアウト

ECモールの各ページのレイアウトを管理します。

{% hint style="info" %}
CS-Cartでは、「**レイアウト**」、「**グリッド**」、「**ブロック**」というパーツを使用して、レゴブロックを組み上げるように各ページをデザインできます。

* **レイアウト** : 各ページのデザインを行う土台となるパーツです。レイアウト上にグリッドやブロックを配置します。
* **グリッド** : ブロックを配置するための枠組みのようなパーツです。ページの横幅を16に分割し、1～16の間で表示幅を指定できます。
* **ブロック** : ロゴや検索バー、商品画像など、具体的な表示内容が定義されたパーツです。グリッド内に配置して使用します。
  {% endhint %}

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

<table><thead><tr><th width="284">項目</th><th>説明</th></tr></thead><tbody><tr><td>「← 」ボタン</td><td>前のページに戻る</td></tr><tr><td>歯車アイコン</td><td>以下のアクションを実行<br>・プロパティ<br>・レイアウトのエクスポート<br>・レイアウトのインポート</td></tr><tr><td>「レイアウトの追加」ボタン</td><td>新しいレイアウトを追加</td></tr><tr><td>ページタイプタブ</td><td>デフォルト、トップページ、商品、カテゴリー内商品一覧などのページタイプを選択</td></tr><tr><td>「レイアウトの編集」ボタン</td><td>現在のレイアウトを編集</td></tr><tr><td>「スマホ」ボタン</td><td>スマートフォンで表示されるグリッドやブロックを表示</td></tr><tr><td>「タブレット」ボタン</td><td>タブレットで表示されるグリッドやブロックを表示</td></tr><tr><td>「PC」ボタン</td><td>PCで表示されるグリッドやブロックを表示</td></tr><tr><td>レイアウト編集エリア</td><td>ページ内の各ブロック（ロゴ、検索、カテゴリーなど）をグリッド内に配置</td></tr><tr><td>ページ切り替え用メニュー</td><td>レイアウト編集ページとブロック管理ページの切り替え用メニュー</td></tr><tr><td>レイアウト</td><td>現在表示しているタブの内容と、レイアウトの編集ウィンドウを表示するリンクを表示</td></tr></tbody></table>


---

# 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://manual-admin.cs-cart.jp/mall-admin/website/themes/layout_manager.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.