> For the complete documentation index, see [llms.txt](https://help.citrusad.com/retail-media-interface/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://help.citrusad.com/retail-media-interface/integration/ja/brand-pages/brand-page-retailer-integration-guide/module-capabilities.md).
# モジュール機能
本書では、利用可能なすべてのモジュールタイプ、そのフィールド、制約、および設定オプションについて説明します。各モジュールがサポートする機能と、ブランドがブランドページコンテンツを作成する際に設定できる項目について、リテールパートナー向けの参照情報としてご活用ください。
***
## モジュールタイプ一覧
| モジュール | 目的 |
| --------- | ------------------------------------- |
| ヒーローバナー | 見出し、サブタイトル、CTAを備えたフル幅メディア |
| 画像 | キャプション、代替テキスト、リンク（すべて任意）付きの単一画像 |
| テキスト | 見出し、キャッチコピー、本文、またはカスタム複数行テキスト |
| 分割レイアウト | 画像モジュールやテキストモジュールを含む2列またはスタック形式のレイアウト |
| 画像ギャラリー | セクションタイトル、説明、CTA（すべて任意）付きの画像グリッド |
| フィルターメニュー | ラベル付きフィルター項目のナビゲーションバー |
| 商品グリッド | フィルタリングやCTA（すべて任意）を備えた厳選された商品グリッド |
## 共通フィールド（全モジュール）
すべてのモジュールで以下のシステム管理フィールドが共有されます。ブランドがこれらを直接設定することはできません。
| フィールド | 説明 |
| --------------------------- | ---------------------------------- |
| `id` | 自動生成される一意識別子 |
| `brandPageModuleTemplateId` | コンテンツをリテールパートナーのモジュールテンプレートにリンクします |
| `order` | ページ上の表示位置（ドラッグ＆ドロップで管理） |
| `optionality` | モジュール全体が必須か省略可能か（リテールパートナーが定義） |
## 1. ヒーローバナー
背景画像、オーバーレイ、見出しテキスト、行動喚起（CTA）を組み合わせたフル幅バナーです。通常、ブランドページの最初のモジュールとして配置されます。
### メディア
| フィールド | 必須の有無 | 制約 |
| ------ | --------------------- | -------------------------------------------------------------------------------- |
| 画像 | 必須 | フォーマット: `GIF`, `JPG`, `PNG`, `SVG` ・最小サイズ: リテールパートナーが定義 ・最大ファイルサイズ: リテールパートナーが定義 |
| 代替テキスト | 必須または任意（リテールパートナーが定義） | アクセシビリティのための説明テキスト |
{% hint style="info" %}
動画のサポートは予定されていますが、まだ利用できません。現在は画像のみが受け入れられます。
{% endhint %}
### オーバーレイ
リテールパートナーは、このモジュールでオーバーレイが利用可能かどうかを定義します:
| 設定 | 挙動 |
| ----------------- | -------------------------------- |
| `disabled` | オーバーレイなし — 画像はカラーレイヤーなしで表示されます |
| `optional` （許可済み） | ブランドはオーバーレイの有効化・無効化を選択できます |
| `required` | オーバーレイは常に表示され、ブランドが無効にすることはできません |
オーバーレイが有効になっている場合、ブランドは背景スタイルを選択します。リテールパートナーは提供するスタイルを制御します:
| スタイル | 説明 |
| ---------- | ---------------- |
| `gradient` | 画像からのグラデーションフェード |
| `solid` | テキスト背面の単色ブロック |
両方のオプションを同時に利用可能にすることができます。
### テキストコンテンツ
| フィールド | 必須の有無 | 制約 |
| ---------- | ------------------------- | ------------------------------------- |
| 見出し | 必須 | 最大文字数: リテールパートナーが定義 |
| サブ見出し | 任意 | 最大文字数: リテールパートナーが定義 |
| CTAボタンテキスト | 必須、任意、または無効（リテールパートナーが定義） | 最大文字数: リテールパートナーが定義 |
| CTAリンクURL | 必須、任意、または無効（リテールパートナーが定義） | 最大文字数: リテールパートナーが定義 ・有効なURLである必要があります |
{% hint style="info" %}
CTAテキストとCTAリンクはセットで設定されます。CTAが無効の場合、どちらのフィールドも表示されません。CTAボタンなしでCTAリンクを設定すること、またはその逆はできません。
{% endhint %}
### テキスト配置
リテールパートナーは、利用可能な配置オプションを定義します。指定可能な値: `left`, `center`, `right`。ブランドは提供されたセットから選択します。
## 2. 画像
任意のキャプション、代替テキスト、およびリンク先を持つ単一の画像。
### 画像のアップロード
| フィールド | 必須の有無 | 制約 |
| ------ | --------------------- | -------------------------------------------------------------------------------- |
| 画像 | 必須 | フォーマット: `GIF`, `JPG`, `PNG`, `SVG` ・最小サイズ: リテールパートナーが定義 ・最大ファイルサイズ: リテールパートナーが定義 |
| 代替テキスト | 必須または任意（リテールパートナーが定義） | アクセシビリティのための説明テキスト |
### キャプション
| フィールド | 必須の有無 | 制約 |
| ------ | ----- | -------------------- |
| キャプション | 任意 | 最大文字数: リテール企業定義 · 1行 |
{% hint style="info" %}
キャプションが利用可能かどうかはリテール企業が定義します。リテール企業がキャプションを有効にしていない場合、このフィールドは表示されません。
{% endhint %}
### リンク
各画像は任意で送信先にリンクできます。ブランドは3つのリンクタイプから1つを選択します。
| リンクタイプ | 説明 |
| --------- | --------------------------- |
| `image` | リンクなし — 画像は非対話型です |
| `url` | 選択時にカスタムURLに遷移します |
| `product` | 特定の商品詳細ページに遷移します（商品ピッカーで選択） |
### 追加のテキスト行
一部の画像モジュールは、画像と一緒にラベル付きの追加テキスト行をサポートしています（例: 画像の下または上に描画されるタイトルや説明）。利用可能性、ラベル、フォントサイズ、および各行が必須か任意かはすべてリテール企業が定義します。
## 3. テキスト
1行および複数行のバリエーションをサポートする柔軟なテキストモジュール。
### バリエーション
リテール企業はモジュールが使用するバリエーションを定義します。
| バリエーション | 説明 |
| ---------- | ----------------------------------- |
| `headline` | 目立つ1行のテキスト — 大きく太字 |
| `tagline` | 補足的な1行 — ヘッドラインより小さい |
| `body` | 本文の1つのブロック — テキストエリアとして描画 |
| `lines` | それぞれ独自のフォントサイズと任意性を持つ、名前付きの複数のテキスト行 |
### フィールド — 1行のバリエーション (`headline`, `tagline`, `body`)
| フィールド | 必須の有無 | 制約 |
| ----- | ----- | --------------------------- |
| テキスト | 必須 | 最大文字数: リテール企業定義（フィールド全体に適用） |
### フィールド — 複数行のバリエーション (`lines`)
各行はリテール企業によって個別に定義されます。
| フィールド | 必須の有無 | 制約 |
| ------ | ---------------------- | -------------------------------------- |
| 行のテキスト | 必須または任意（行ごとにリテール企業が定義） | 最大文字数: リテール企業定義（行ごとに適用） |
| 行のURL | 任意 | 以下が有効になっている行でのみ利用可能: `isHyperlink` が有効 |
### CTA
| フィールド | 必須の有無 | 制約 |
| ---------- | ------------------------- | ---------------- |
| CTAボタンテキスト | 必須、任意、または無効（リテールパートナーが定義） | — |
| CTAリンクURL | 必須、任意、または無効（リテールパートナーが定義） | 有効なURLである必要があります |
{% hint style="info" %}
CTAの任意性は、テキストとURLの両方に一緒に適用されます。無効になっている場合、どちらのフィールドも表示されません。
{% endhint %}
### 配置
リテール企業定義。選択可能な値: `left`, `center`, `right`。モジュール内のすべてのテキストに適用されます。
### 最大幅
リテール企業は以下を設定します `maxWidth` テキストブロックの表示幅を制限する制約（例: `600px` or `80%`）。これは表示上の制約であり、コンテンツの制約ではありません。
## 4. 分割レイアウト
列または行に配置された2つ以上の子モジュールを保持するレイアウトコンテナ。子は**Image**および/または**Text**モジュールです。ネストは最大深度2までサポートされていますが、ルートレベルで分割レイアウトをネストすることはできません。
### レイアウトオプション
| レイアウト | オプション |
| --------- | -------------------------------------------------------- |
| `columns` | 横並び。比率: `50:50`, `33:67`, or `67:33` （提供される比率はリテール企業が定義） |
| `rows` | 垂直に配置 |
### 間隔
子同士の間のギャップはリテール企業が定義し、リテール企業のスタイルガイドの間隔スケールから取得されます。
### 子
| プロパティ | 値 |
| ---------- | ----------------------------------------------------------- |
| 許可される子のタイプ | `Image`, `Text` |
| 子の数 | リテール企業定義 (`numChildren`) |
| ネスト | 分割レイアウトの子自体に以下を含めることができます `Image` および `Text` モジュール（最大深度: 2） |
{% hint style="info" %}
重要
Hero Banner、Image Gallery、Filter Menu、またはProduct Gridを分割レイアウト内に配置することはできません。
{% endhint %}
## 5. 画像ギャラリー
任意のセクションヘッダー、説明、および下部CTAを備えた画像のグリッド。
### セクションヘッダー
| フィールド | 必須の有無 | 制約 |
| --------- | ------------------------- | -- |
| セクションタイトル | 必須、任意、または無効（リテールパートナーが定義） | — |
| セクションの説明 | 必須、任意、または無効（リテールパートナーが定義） | — |
### ギャラリーのレイアウト
ブレークポイントごとにリテール企業が定義:
| プロパティ | 説明 |
| ----- | -------------------------------------------- |
| 列 | モバイル、タブレット、デスクトップにおける列数（リテールメディア側で定義） |
| 画像の高さ | ブレイクポイントごとのピクセルまたはパーセンテージ指定の高さ（リテールメディア側で定義） |
| ギャップ | 画像間の間隔（リテールメディアのスタイルガイドに従う） |
### 画像
| プロパティ | 制約 |
| ----------- | --------------------------------------------- |
| 最小画像数 | リテールメディア側で定義（少なくともこの枚数を追加する必要があります） |
| 最大画像数 | リテールメディア側で定義（この枚数を超えることはできません） |
| フォーマット | `GIF`, `JPG`, `PNG`, `SVG` |
| 最小寸法 | リテールメディア側で定義 |
| 最大ファイルサイズ | リテールメディア側で定義 |
| 代替テキスト | 画像ごとに必須または任意（リテールメディア側で定義） |
| 画像ごとのキャプション | 任意、最大文字数：リテールメディア側で定義 |
| 画像ごとのリンク | `image` (なし) · `url` · `product` — 画像モジュールと同じ |
### 画像ごとの追加テキスト行
画像モジュールと同じ — 行ごとにリテールメディア側で定義されたラベル、フォントサイズ、および任意性。
### CTA（ギャラリーの下部）
| フィールド | 必須の有無 | 制約 |
| ---------- | ---------------------------------------- | ---------------- |
| CTAボタンテキスト | 必須、任意、または無効（リテールパートナーが定義） | — |
| CTAリンクURL | 必須、任意、または無効（リテールパートナーが定義） | 有効なURLである必要があります |
| CTAの配置 | `left`, `center`, `right` （リテールメディア側で定義） | — |
## 6. フィルターメニュー
ラベルが付いたフィルター項目の水平ナビゲーションバー。ショッパーがページ上のコンテンツを（カテゴリやサブカテゴリなどで）絞り込めるようにするために使用します。
### 項目
| プロパティ | 制約 |
| ------- | ------------------------------------ |
| 最小項目数 | リテールメディア側で定義（少なくともこの枚数を追加する必要があります） |
| 最大項目数 | リテールメディア側で定義（この枚数を超えることはできません） |
| ラベルテキスト | 最大文字数: リテールパートナーが定義 |
| フィルター値 | 絞り込みロジックで使用される内部値。最大文字数：リテールメディア側で定義 |
### 配置
リテール企業定義。選択可能な値: `left`, `center`。
フィルター項目は並べ替えることができます。ラベルはショッパーに表示されるものであり、値はフィルターとして適用されるものです。これらは同じ文字列である必要はありません。
## 7. プロダクトグリッド
ブランドによって厳選された商品のグリッド。オプションでセクションヘッダー、絞り込み、CTAを含めることができます。
### セクションヘッダー
| フィールド | 必須の有無 | 制約 |
| --------- | ------------------------- | -- |
| セクションタイトル | 必須、任意、または無効（リテールパートナーが定義） | — |
| セクションの説明 | 必須、任意、または無効（リテールパートナーが定義） | — |
### 商品
| プロパティ | 制約 |
| ----- | ---------------------- |
| 最小商品数 | リテールメディア側で定義 |
| 最大商品数 | リテールメディア側で定義 |
| 商品ソース | ブランドのカタログから商品ピッカー経由で選択 |
| 表示順序 | モジュール内でのドラッグ＆ドロップ |
### 商品カードのCTA
各商品カードにCTAボタンを表示するかどうかは、リテールメディア側で決定します：
| 設定 | 挙動 |
| -- | ----------------------------------------- |
| 無効 | 商品カードにCTAボタンなし |
| 有効 | CTAボタンが表示されます。リテールメディア側でボタンのラベルテキストを設定します |
{% hint style="info" %}
有効にすると、グリッド内のすべての商品カードが同じCTAラベルを共有します（ブランドではなく、リテールメディア側で設定）。
{% endhint %}
### 絞り込み
リテールメディア側は、オプションでプロダクトグリッドのオンページ絞り込みを有効にできます：
| 設定 | 説明 |
| ------------------- | -------------------------------- |
| `enabled` | ショッパーは商品グリッドを絞り込むことができます |
| `showActiveFilter` | 現在アクティブなフィルターをハイライト表示します |
| `showResultCount` | アクティブなフィルターに一致する結果の件数を表示します |
| `emptyStateMessage` | フィルターに一致する商品がない場合に表示されるカスタムメッセージ |
{% hint style="info" %}
絞り込みはフィルターメニューモジュールと連動して機能します。商品に設定されたフィルター値は、フィルターメニュー内のフィルター項目値と一致する必要があります。
{% endhint %}
### CTA（グリッドの下部）
| フィールド | 必須の有無 | 制約 |
| ---------- | ---------------------------------------- | ---------------- |
| CTAボタンテキスト | 必須、任意、または無効（リテールパートナーが定義） | — |
| CTAリンクURL | 必須、任意、または無効（リテールパートナーが定義） | 有効なURLである必要があります |
| CTAの配置 | `left`, `center`, `right` （リテールメディア側で定義） | — |
## 制約リファレンス
### `ContentLimit` — テキストフィールドの制約モデル
| 値 | 意味 |
| ----------------------- | ---------------------------------------------- |
| `disabled` | このテンプレートではフィールドを使用できません |
| `allowed` + `maxChars` | フィールドは任意です。入力する場合、上限を超えることはできません `maxChars` 文字 |
| `required` + `maxChars` | 入力必須。以下を超過することはできません: `maxChars` 文字 |
### `ImageConstraints` — 画像アップロード制約モデル
| プロパティ | 説明 |
| ----------------- | ------------------------------------------------------- |
| `altOptionality` | `required` or `allowed` |
| `minWidth` | 最小画像の幅（ピクセル単位、任意） |
| `minHeight` | 最小画像の高さ（ピクセル単位、任意） |
| `maxFileSizeMb` | 最大ファイルサイズ（メガバイト単位、任意） |
| `acceptedFormats` | 次のサブセット: `GIF`, `JPG`, `PNG`, `SVG` （任意 — 未設定の場合はすべて許可） |
### `CtaConfig` — Call-To-Action 制約モデル
| プロパティ | 説明 |
| ------------- | ----------------------------------- |
| `optionality` | `required` · `allowed` · `disabled` |
| `alignment` | `left` · `center` · `right` |
## リテールメディア企業定義と固定の比較
| 設定 | リテールメディア企業がこれを設定します | プラットフォームによって固定されています |
| ------------------------ | :---------------------: | :-----------------------: |
| モジュールがスキップ可能かどうか | ✅ | |
| 最大文字数制限 | ✅ | |
| 画像の最小寸法と最大ファイルサイズ | ✅ | |
| 許可される画像形式 | ✅（プラットフォームがサポートするサブセット） | |
| CTAが必須、任意、または無効のいずれであるか | ✅ | |
| オーバーレイが利用可能かどうか (Hero) | ✅ | |
| 提供されるテキストの配置オプション | ✅ | |
| 列比率のオプション (Split Layout) | ✅ | |
| 最小/最大画像数 (Image Gallery) | ✅ | |
| 最小/最大商品数 (Product Grid) | ✅ | |
| 利用可能なモジュールタイプ | | ✅（7種類、固定） |
| サポートされているメディアタイプ (Hero) | | ✅（画像のみ。動画は計画中） |
| 画像のリンクタイプ | | ✅ (image · url · product) |
| Split Layout の最大ネスト深度 | | ✅（深度 2） |
| Split Layout で許可される子タイプ | | ✅（Image と Text のみ） |
---
# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.
## 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, and the optional `goal` query parameter:
```
GET https://help.citrusad.com/retail-media-interface/integration/ja/brand-pages/brand-page-retailer-integration-guide/module-capabilities.md?ask=&goal=
```
`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.
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.