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

# 微站编辑器说明

微站编辑器可让你自定义布局、页面、内容以及字体和颜色等品牌元素，从而控制推广大使计划参与者将看到的内容。

这篇帮助文章解释了编辑器的界面，并提供了有关微站如何构成的一般信息，包括布局、页面和组件。了解更多关于 [设置微站](/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, and the optional `goal` 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>&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.