> 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/overview-1.md).

# 概要

## ブランドページとは？

ブランドページは、貴社のウェブサイト上に存在する、特定のブランドコンテンツを魅力的に見せるカスタマイズされたランディングページ体験です。これらは貴社のドメイン上でホストされ、貴社のUIコンポーネントを使用してレンダリングされます。

ブランドページは、通常の広告キャンペーンとは別に Epsilon プラットフォームで管理されます。\
ブランドページは類似の作成および審査ワークフローを使用しますが、従来の広告ではなく、リテール事業者のサイト上でのブランド化されたランディングページ体験を表します。

**例：** ユーザーが `yoursite.com/brands/nike` を訪問し、Nike製品が掲載されたNikeブランドのページを目にします。ただし、見た目や質感は貴社のウェブサイトの一部のように感じられます。

## 構築する内容

リテール事業者のエンジニアとして、以下の作業を行います：

* ブランドページURLのルートを追加する（例： `/brands/{slug}`).

{% hint style="info" %}
リテール事業者は、各ブランドページごとにURLを用意する必要はありません。URLはプラットフォームによって自動的に管理されます。

ただし、ブランドページのベースURL（プレフィックスを含む）はオンボーディング時に設定する必要があります（例：リテール事業者スタイルガイド内）。完全なURLまたはプレフィックスが提供されない場合、ブランドページURLは設定ページに自動入力されません。
{% endhint %}

* 抽出したスラグを使用してBrand Pages APIを呼び出します。
* 返されたコンテンツモジュールをレンダリングします。
* インプレッション、クリック、およびカート追加のトラッキングを実装します。
* ファーストパーティトラッキング用のリバースプロキシを設定します。

{% hint style="info" %}
この手順は、クライアントサイドトラッキングの場合にのみ必要です。
{% endhint %}

### 貴社の責任と Epsilon's

| 貴社が担当                  | Epsilon 提供するもの         |
| ---------------------- | ---------------------- |
| ✅ コンテンツを取得するためのAPI連携   | ✅ ブランドページのコンテンツとテンプレート |
| ✅ 貴社サイト上でのコンテンツのレンダリング | ✅ トラッキングインフラストラクチャ     |
| ✅ リバースプロキシの設定          | ✅ アナリティクスとレポート         |
| ✅ 貴社のスタイルガイドの提供        | ✅ キャンペーン管理ツール          |
| ✅ テストと検証               | ✅ テクニカルサポート            |

## ブランドページの仕組み

### エンドツーエンドのフロー

{% hint style="info" %}
ブランドページのコンテンツは、 Epsilon UIで設定およびプレビューされます。リテール事業者はAPIを通じてのみブランドページを連携し、自社サイト上で最終的な体験をレンダリングする責任を負います。
{% endhint %}

審査プロセス中、リテール事業者は承認前に設定されたブランドページコンテンツをプレビューできます。

### テンプレートとモジュール

オンボーディング期間中、 Epsilon は貴社のチームと協力して、以下を定義するテンプレートを作成します：

* 利用可能なコンテンツモジュール（ヒーロー、プロダクトグリッド、テキスト、画像など）。モジュール名は貴社のリテールタクソノミーに合わせてUI上で設定可能です。
* 各モジュールの制限事項（文字数制限、画像サイズなど）。
* 貴社のブランドガイドラインに沿ったスタイリング。

ブランドはキャンペーン作成時にテンプレートを選択し、それらの制限内でコンテンツを入力します。

{% hint style="info" %}
Brand Pages APIはコンテンツモジュールとトラッキングURLを返します。リテール事業者は、自社のUIコンポーネントとデザインシステムを使用してスタイリングを適用する責任を負います。
{% endhint %}

**例**

以下の例は、ブランドがブランドページを作成する際に一般的なコンテンツモジュールにデータを入力する方法を示しています。これらはサンプル入力であり、選択したテンプレートやキャンペーンの目的に応じて調整できます。

**HEROモジュール**

* **Headline:** 最新のサマーコレクションを見る
* **Subheadline:** あらゆるシーンに合わせたフレッシュなスタイル
* **CTA:** 今すぐショッピング

**TEXTモジュール**

快適性、スタイル、パフォーマンスを重視して設計された、日常着に最適な最新の入荷商品をぜひご覧ください。

**IMAGEモジュール**

* Caption:\*\* 新作が入荷しました
* **Alt text:** サマーコレクションを着用したモデル
* URL: <https://example-cdn.com/summer-collection.jpg>

**PRODUCT\_GRIDモジュール**

プロダクトグリッドを使用して、売れ筋商品や季節商品をアピールし、エンゲージメントとコンバージョンを促進します。

#### モジュール設定：

| モジュール          | 説明                        | 設定可能な要素（概要）                   |
| -------------- | ------------------------- | ----------------------------- |
| HERO           | 画像、見出し、CTAを備えた全幅バナー       | 見出し、小見出し、CTA、画像、オーバーレイ        |
| PRODUCT\_GRID  | 商品のグリッドまたはカルーセル           | 商品、セクションタイトル、説明、CTA           |
| TEXT           | テキストコンテンツブロック（見出し、本文）     | テキストフィールド、CTA                 |
| IMAGE          | オプションのリンク付き単一画像           | 画像、キャプション、代替テキスト、オプショナルリンク    |
| IMAGE\_GALLERY | グリッドレイアウト内の複数画像           | 画像、キャプション、代替テキスト、セクションタイトル、説明 |
| FILTER\_MENU   | 商品グリッド用の水平フィルタータブ         | フィルターラベルと順序付け                 |
| SPLIT\_LAYOUT  | ネストされたモジュールを持つマルチカラムレイアウト | レイアウト構造とネストされたモジュール           |

{% hint style="info" %}
各設定可能要素は、モジュールとリテールパートナーの要件に応じて、必須、オプショナル（許可）、または無効として設定できます。

一部のフィールドは、必須または許可としてマークされている場合、最大文字数制限を適用することもあります。
{% endhint %}

### モジュールタグ

テンプレートには、各モジュールにオプションの `tags` フィールド（例: `["header"]`など、インテグレーションがレイアウト決定、アナリティクス、または自社コンポーネントへのモジュールのマッピングに使用できる短い文字列ラベルのリスト）を含めることができます。

#### APIレスポンスにおけるタグの仕組み

* モジュールにタグがある場合、それらは対応するアイテムの `tags` 配列として表示されます `contentData`.
* モジュールにタグがない場合、 `tags` プロパティはレスポンスから完全に省略されます。次のように表示されることはありません `"tags": []`.
* 欠落している `tags` フィールドは「タグなし」と同様に扱ってください。存在しない場合でもエラーをスローしないでください。
* タグは、ルートの分割モジュールだけでなく、 `SPLIT_LAYOUT` 内のネストされたモジュールでもサポートされています。

{% hint style="info" %}
重要

タグは、リテールパートナーとそのインテグレーションチームとの間で合意された不透明なラベルです。広告トラッキングタグやその他のシステムとは関係ありません。混乱を避けるため、これらは常に *「モジュールタグ」* または *「ブランドページモジュールタグ」* と呼んでください。
{% endhint %}

タグを持つレスポンスモジュールの例

```json
{
  "id": "image-1",
  "contentType": "IMAGE",
  "order": 1,
  "tags": ["header"],
  "imageUrl": "https://example.com/images/banner.jpg"
}
```

**タグのないレスポンスモジュールの例（tagsプロパティは省略）:**

```json
{
  "id": "image-2",
  "contentType": "IMAGE",
  "order": 2,
  "imageUrl": "https://example.com/images/promo.jpg"
}
```

#### これがAPIレスポンスにとって意味すること

The `POST /ads/v3/brand-pages` レスポンスにはこれらと同じルールが反映されます。モジュールタイプは、ライブテンプレートの一部であり、ブランドページがそのモジュールのコンテンツを設定している場合にのみ `contentData` に表示されます。

テンプレートがそれらをオプショナルまたは無効としてマークしている場合、あるいはブランドが設定しないままにしている場合、モジュール内のフィールドはJSONから欠落していたり、 `null`、または空であったりする可能性があります。これは予期された動作であり、欠陥のあるペイロードを示すものではありません。

オプショナルなタイプと安全なアクセサを使用してレンダリングを実装してください。例えば、 `ctaText` とナビゲーションターゲットの両方が存在する場合にのみCTAブロックをレンダリングし、 `mediaUrl`が存在しない場合はヒーローメディアを非表示にします。

`trackers`ページレベルまたはノード上の計測可能なインタラクションがない場合は、省略されることがあります。URLの組み立ては、 `trackingTypes` からの該当するテンプレートキーと、対応する `trackers.`\<slot>`.params`の両方が存在する場合にのみ行ってください。


---

# 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/overview-1.md?ask=<question>&goal=<endgoal>
```

`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.