> 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/zh/what-would-you-like-to-learn-about/advocate-program/manage-advocate-participant-experiences/microsite-experiences/microsite-editor-explained.md).

# 微站编辑器说明

微网站编辑器让你可以通过自定义布局、页面、内容以及字体和颜色等品牌元素，来控制你的 Advocate 计划参与者将看到的内容。

本帮助文章介绍编辑器界面，并提供有关微网站结构的一般信息，包括布局、页面和组件。了解更多关于 [设置微网站](/brand/zh/what-would-you-like-to-learn-about/advocate-program/manage-advocate-participant-experiences/microsite-experiences/set-up-a-microsite.md) 和 [自定义品牌和内容](/brand/zh/what-would-you-like-to-learn-about/advocate-program/manage-advocate-participant-experiences/microsite-experiences/customize-microsite-layouts-and-pages.md) 及其布局和页面。

#### 打开微网站编辑器

1. 从左侧导航菜单中，选择 ![](/files/209022bdb234289211a24a980f6227a8684cc439) **\[Engage] → 内容**.
2. 在 *Microsite* 卡片中，选择 **编辑内容**.

#### 编辑器界面

微网站编辑器由顶部菜单栏、编辑画布、微网站侧边展开栏和组件菜单组成。

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

{% tabs %}
{% tab title="顶部菜单栏" %}
页面顶部的菜单栏可用于撤销操作、查看 HTML 代码以及预览完成后的微网站。使用桌面、平板或移动设备图标来查看你的微网站在不同屏幕尺寸设备上的显示效果。
{% endtab %}

{% tab title="画布" %}
画布会显示你微网站当前的内容。你可以选择单个组件进行编辑，或者添加新组件，并一目了然地看到它们将如何向参与者显示。这些组件列在微网站侧边展开栏部分的左侧。

* 选择 **图层** 查看页面或布局中所有组件的详细视图
* 选择 **模板** 查看你的微网站页面可用的模板。
* 你会看到一个根据你所选页面、布局、小部件或电子邮件而变化的第三个菜单

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

{% endtab %}

{% tab title="微网站侧边展开栏" %}
微网站侧边展开栏是画布左侧一个可折叠面板。它以树状结构展示你的布局和页面的继承关系。选择单个布局或页面以查看内容并进行调整。你还可以在这里添加更多页面和布局。

若要在品牌层面进行更进一步的样式设置，请选择“微网站样式”选项。查看 [使用内容编辑器自定义小部件和微网站](/brand/zh/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 %}

如果你使用自动设置创建了微网站，那么默认情况下你的网站会有三个布局。

**基础布局**

基础布局是你可以放置希望无论参与者位于哪个页面、以及是否已在你的网站上认证，都需要显示的内容。你可以在这里添加希望在整个网站中显示的页眉或页脚。基础布局还包含品牌容器，用于管理整个网站的颜色和字体。

两者都 *已登录布局* 以及 *已登出布局* 继承了 *基础布局*.

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

**已登录布局**

“ *已登录布局* 是你可以添加所有已登录参与者都会看到的组件的地方，无论他们当前在哪个页面。例如，你的微网站侧边导航菜单就是通过该布局中的一个组件创建的。由于它被添加到了布局中，任何继承该布局的页面都会包含这个侧边栏。

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

**已登出布局**

“ *已登出布局* 是你可以自定义任何当前未认证的参与者将看到内容的地方。

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

</details>

<details>

<summary>页面</summary>

页面是你构建网站内容的地方，例如计划说明、推荐与分享信息，以及文本/图片。选择某个布局中的单独页面即可打开并编辑其内容。

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

可见性也可以在页面级别设置，从而允许你将页面访问限制为以下选项之一：

* <mark style="color:$success;">**已验证**</mark>：仅限已登录参与者。
* <mark style="color:$danger;">**未验证**</mark>：已登录但尚未验证电子邮件地址的参与者。
* **公开**：任何人均可查看。

如果你使用自动设置创建了微网站，那么你的网站会自带几个继承了 *已登录布局* 以及 *已登录布局*.

**已登录布局的页面：**

* 活动
* 仪表板
* 编辑个人资料
* 线索提交
* 税务和现金

**已登出布局的页面：**

* 电子邮件验证
* 忘记密码
* 登录
* 注销
* 页面未找到
* 注册
* 重置密码
* 验证电子邮件

</details>

<details>

<summary>组件</summary>

组件是你可以添加到页面和布局中的单独元素，用于进一步个性化参与者的微网站体验，例如主视觉图片或推荐信息流。

组件在组件菜单中分组显示。请参阅 [小部件和微网站组件说明](/brand/zh/what-would-you-like-to-learn-about/advocate-program/manage-advocate-participant-experiences.md) 以查看组件分组和各个组件的完整列表。

<div data-with-frame="true"><figure><img src="/files/456049d471d5bd27f1d98ea975445748a98e6669" 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:

```
GET https://help.impact.com/brand/zh/what-would-you-like-to-learn-about/advocate-program/manage-advocate-participant-experiences/microsite-experiences/microsite-editor-explained.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.