> For the complete documentation index, see [llms.txt](https://help.impact.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://help.impact.com/brand/ja/what-would-you-like-to-learn-about/advocate-program/manage-advocate-participant-experiences/microsite-experiences/microsite-editor-explained.md).

# マイクロサイトエディターの解説

マイクロサイトエディタを使うと、レイアウト、ページ、コンテンツ、フォントや色などのブランディング要素をカスタマイズして、Advocateプログラムの参加者に表示される内容を管理できます。

この記事では、エディタのインターフェースについて説明し、レイアウト、ページ、コンポーネントなど、マイクロサイトの構成に関する一般的な情報を紹介します。について詳しく見る [マイクロサイトの設定](/brand/ja/what-would-you-like-to-learn-about/advocate-program/manage-advocate-participant-experiences/microsite-experiences/set-up-a-microsite.md) と [ブランディングとコンテンツのカスタマイズ](/brand/ja/what-would-you-like-to-learn-about/advocate-program/manage-advocate-participant-experiences/microsite-experiences/customize-microsite-layouts-and-pages.md) そのレイアウトとページの。

#### マイクロサイトエディタを開く

1. 左側のナビゲーションメニューから、次を選択します： ![](/files/7ddd72d8e69e7055d9408cf4847c5c54abf9f71d) **\[Engage] → コンテンツ**.
2. の *マイクロサイト* カードで、次を選択します： **コンテンツを編集**.

#### エディタのインターフェース

マイクロサイトエディタは、上部メニューバー、編集キャンバス、マイクロサイトのスライドアウト、コンポーネントメニューで構成されています。

<div data-with-frame="true"><figure><img src="/files/ca98ebba30b67b7c4d5e9b92039aef2279c22b34" alt=""><figcaption></figcaption></figure></div>

{% tabs %}
{% tab title="上部メニューバー" %}
ページ上部のメニューバーでは、操作の取り消し、HTMLコードの表示、完成したマイクロサイトのプレビューができます。デスクトップ、タブレット、モバイルの各アイコンを使って、異なる画面サイズのデバイスでマイクロサイトがどのように表示されるかを確認できます。
{% endtab %}

{% tab title="キャンバス" %}
キャンバスには、マイクロサイトの現在のコンテンツが表示されます。個々のコンポーネントを選択して編集したり、新しいコンポーネントを追加して、参加者にどのように表示されるかをひと目で確認できます。これらのコンポーネントは、マイクロサイトのスライドアウトセクション内の左側に一覧表示されます。

* 選択します： **レイヤー** ページまたはレイアウト上のすべてのコンポーネントの詳細ビューを表示するには
* 選択します： **テンプレート** マイクロサイトのページで利用可能なテンプレートを表示するには。
* 選択したページ、レイアウト、ウィジェット、またはメールに応じた3つ目のメニューが表示されます

  <div data-with-frame="true"><figure><img src="/files/01d2ecb769dc6dca78f598a589eb3e413d418369" alt="" width="122"><figcaption></figcaption></figure></div>

{% endtab %}

{% tab title="マイクロサイトのスライドアウト" %}
マイクロサイトのスライドアウトは、キャンバスの左側にある折りたたみ可能なパネルです。レイアウトとページの継承構造をツリーとして可視化します。個々のレイアウトやページを選択してコンテンツを表示し、調整できます。ここでは、ページやレイアウトを追加することもできます。

ブランディングレベルでもさらにスタイリングを行うには、Microsite Styleオプションを選択します。表示 [コンテンツエディタでウィジェットとマイクロサイトをカスタマイズする](/brand/ja/what-would-you-like-to-learn-about/advocate-program/manage-advocate-participant-experiences/customize-widgets-and-microsites-with-the-content-editor.md) 利用可能なスタイル設定オプションの詳細については
{% endtab %}

{% tab title="コンポーネントメニュー" %}
コンポーネントメニューはキャンバスの右側にあるパネルです。使用して *追加* タブでキャンバスに新しいコンポーネントを挿入し、 *編集* タブで既存の内容を調整します。
{% endtab %}
{% endtabs %}

#### マイクロサイトの構成

マイクロサイトをカスタマイズする際に理解しておくべき基本要素がいくつかあります。レイアウト、ページ、コンポーネントです。

<details>

<summary>レイアウト</summary>

レイアウトは、マイクロサイトの「フレーム」として機能します。ヘッダーやバナー画像など、マイクロサイト全体に表示したいコンポーネントを配置する場所です。

レイアウトとページは継承構造によってリンクされています。ページもレイアウトも、レイアウトを継承できます。継承されたレイアウトを持つページやレイアウトでは、コンテンツが継承元レイアウトのコンテンツで囲まれます。

{% hint style="info" %}
**例：** ベースレイアウトにヘッダー画像が含まれている場合、ベースレイアウトを継承するすべてのページに、同じヘッダー画像が同じ位置に表示されます。
{% endhint %}

マイクロサイトの作成に自動設定を使用した場合、サイトには既定で3つのレイアウトがあります。

**ベースレイアウト**

ベースレイアウトは、参加者がどのページにいるか、サイトに認証済みかどうかにかかわらず表示したいコンテンツを配置する場所です。サイト全体に表示したいヘッダーやフッターを追加することもできます。ベースレイアウトには、サイト全体の色とフォントを管理するブランドコンテナーも含まれています。

どちらも *ログイン済みレイアウト* と *ログアウト時レイアウト* を継承します *ベースレイアウト*.

<div data-with-frame="true"><figure><img src="/files/2a406f5d90fe15247ed5e0631e80c93b81606776" alt="" width="312"><figcaption></figcaption></figure></div>

**ログイン時レイアウト**

この *ログイン済みレイアウト* ログイン中のすべての参加者に、どのページにいても表示されるコンポーネントを追加できる場所です。たとえば、マイクロサイトのサイドバーのナビゲーションメニューは、レイアウト内のコンポーネントによって作成されます。レイアウトに追加されているため、そのレイアウトを継承するページには、すべてそのサイドバーが含まれます。

<div data-with-frame="true"><figure><img src="/files/357d01e852bf574b68c23b43f6ff7f548962fd82" alt="" width="310"><figcaption></figcaption></figure></div>

**ログアウト時レイアウト**

この *ログアウト時レイアウト* 現在認証されていない参加者に表示される内容をカスタマイズできる場所です。

<div data-with-frame="true"><figure><img src="/files/f225494f36c4ca3cb8690736428e66908dbea4d2" alt="" width="291"><figcaption></figcaption></figure></div>

</details>

<details>

<summary>ページ</summary>

ページは、プログラムの説明、紹介や共有に関する情報、テキスト/画像など、サイトのコンテンツを作成する場所です。レイアウト内の個々のページを選択して、そのコンテンツを開いて編集できます。

<div data-with-frame="true"><figure><img src="/files/9e20d6692471082af3bee5628e1793a16f1b1c0a" alt="" width="318"><figcaption></figcaption></figure></div>

表示設定はページ単位でも設定でき、ページへのアクセスを次のいずれかに制限できます:

* <mark style="color:$success;">**認証済み**</mark>: ログイン中の参加者のみ。
* <mark style="color:$danger;">**未認証**</mark>: メールアドレスを確認していないログイン中の参加者。
* **公開**: だれでも閲覧可能。

マイクロサイトの作成に自動設定を使用した場合、サイトには次を継承するいくつかのページがあらかじめ用意されています *ログイン済みレイアウト* と *ログイン済みレイアウト*.

**ログイン時レイアウトのページ:**

* アクティビティ
* ダッシュボード
* プロフィールを編集
* リード送信
* 税金と現金

**ログアウト時レイアウトのページ:**

* メール認証
* パスワードを忘れた場合
* ログイン
* ログアウト
* ページが見つかりません
* 登録
* パスワードをリセット
* メールを確認

</details>

<details>

<summary>コンポーネント</summary>

コンポーネントは、ヒーロー画像や紹介フィードなど、参加者のマイクロサイト体験をさらにパーソナライズするために、ページやレイアウトに追加できる個別の要素です。

コンポーネントは、コンポーネントメニュー内でグループ化されています。参照先は [ウィジェットとマイクロサイトのコンポーネント解説](/brand/ja/what-would-you-like-to-learn-about/advocate-program/manage-advocate-participant-experiences.md) コンポーネントのグループ分けと個々のコンポーネントの完全な一覧について。

<div data-with-frame="true"><figure><img src="/files/5d925d8969c7fa46363ab32ed2b6550bdfd98d0f" alt="" width="229"><figcaption></figcaption></figure></div>

</details>


---

# 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.impact.com/brand/ja/what-would-you-like-to-learn-about/advocate-program/manage-advocate-participant-experiences/microsite-experiences/microsite-editor-explained.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.