# 网页表单
**网页表单**是带有输入字段的网页内容：电子邮件字段、将回答保存到标签的字段、同意复选框和提交按钮。在 Popup 或 Inline [网页营销活动](/zh/product/messaging-channels/web-popups/create-web-popups-campaigns/)中显示它，即可为访问者订阅电子邮件，并将他们提供的信息存储到其个人资料中，无需另外设置订阅表单。
## 网页表单的工作原理
当访问者提交表单时，Pushwoosh 会按顺序执行以下操作：
1. 立即将 **Tag input** 字段中每个已填写的回答写入访问者浏览器设备上对应的标签，即使访问者未订阅网页推送也是如此。空回答会保留标签的当前值不变。
2. 如果表单包含 **Email input**，则为该电子邮件地址订阅电子邮件，并创建一个具有相同标签值的电子邮件设备。如果启用了[双重选择加入](#confirm-emails-with-double-opt-in)，访问者会先收到一封确认电子邮件。
3. Pushwoosh 接受提交后，显示表单的 [Success 页面](#design-the-success-page)。
如果您的套餐不包含 Web 平台，则不会保存标签，但提交仍会被接受。没有 **Email input** 的表单只会将标签保存到浏览器设备，例如用于询问访问者的兴趣。
## 构建网页表单
要构建表单，请创建表单、添加字段、设计 Success 页面并保存。如果表单较长，请将其拆分为多个页面。
### 创建网页表单
1. 前往 **Content → Web content**。
2. 点击 **Create** 并选择 **Web form** 类型。
3. 选择一个模板：
- **Email subscription：** 注册表单，包含标题、电子邮件字段、同意复选框、**Submit** 按钮和显示“Thank you!”的 Success 页面。
- **Blank form：** 只有标题和 **Submit** 按钮的空表单。
4. 点击顶部栏中的名称，为表单输入名称。访问者看不到该名称。表单在有名称之前无法保存。
### 添加表单字段
网页表单包含 **Text**、**Button** 和 **Icon** 块，以及四种表单块：**Email input**、**Tag input**、**Consent** 和 **Submit**。
1. 打开右侧的 **Elements** 选项卡。
2. 将一个块拖到表单上，或单击它以将其添加到当前页面。
3. 在表单上选择该块。其选项会在 **Settings** 选项卡中打开。
- 要向上或向下移动块，请使用 **POSITION** 箭头。
- 要删除块，请单击删除图标。
一个表单只能有一个 **Email input** 和一个 **Submit**，因此表单中有了它们之后，对应的磁贴将变为不可用。
撤销和重做的工作方式与网页内容中相同。请参阅[撤销和重做](/zh/product/content/web-popup-content/web-content/#undo-and-redo)。
有关设置每个块的更多信息，请参阅[内容块](/zh/product/content/web-popup-content/blocks/)。
### 设计 Success 页面
每个网页表单都以一个 **Success** 页面结束，访问者会在 Pushwoosh 接受提交后看到该页面。您无法删除该页面，也无法将其设为起始页面。
1. 点击 **Success** 选项卡，即 **+ Add page** 之后的最后一个选项卡。
2. 像编辑其他页面一样编辑该页面。使用 **Text**、**Button** 和 **Icon** 块，例如用于显示带有折扣码的感谢消息。此处不能放置 **Submit** 按钮。
### 将较长的表单拆分为多个页面
添加页面，以便每次少问几个问题。
1. 点击 **+ Add page**。新页面会添加在当前页面之后，并且永远不会添加在 **Success** 页面之后。
2. 添加一个带有 **Go to page** 操作的按钮，让访问者前进到下一页。
直接跳转到 **Success** 页面的按钮会提交表单。有关如何添加、复制和删除页面，请参阅[多个页面](/zh/product/content/web-popup-content/multi-page/)。
复制的页面不包含其表单块。一个表单只有一个 **Email input** 和一个 **Submit**，并且每个标签只能使用一次。
#### 多页表单的提交方式
表单唯一的 **Submit** 按钮会一并发送所有页面。
表单发送之前：
- 当前页面上有字段无效时，访问者无法前进。返回上一页始终可行。
- 提交时，表单会先在浏览器中检查每个页面。如果其他页面上有字段无效，表单会切换到该页面并在那里显示该字段的错误文本，不会发送任何内容。
表单发送之后：
- 如果 Pushwoosh 拒绝了电子邮件地址，表单会切换到包含 **Email input** 的页面，并在那里显示其 **Invalid email text**。
- 如果 Pushwoosh 因其他原因拒绝了提交，例如字段与已保存的表单不再匹配，访问者会停留在当前页面并看到 **Submit error text**。
### 保存表单
要在保存前以完整尺寸查看表单，请点击 **Preview**。预览不会发送任何内容，因此请在您的网站上测试表单。
1. 点击顶部栏中的 **Save**。
2. 如果打开了 **The form can't be saved yet** 横幅，请修复其中列出的每个问题。请参阅[如果表单无法保存](#if-the-form-cant-be-saved)。
3. 再次点击 **Save**。
#### 如果表单无法保存
**The form can't be saved yet** 横幅会列出阻止保存的每个问题。在下表中找到您看到的消息，并按说明操作。
| 横幅中的消息 | 操作方法 |
|---|---|
| **Add an Email input or a Tag input** | 至少添加一个字段。 |
| **The form needs exactly one Submit button, not on the success page** | 保留一个 **Submit** 按钮，并将其放在 **Success** 以外的页面上。 |
| **A form with an Email input needs a Consent block with a privacy policy URL** | 添加一个 **Consent** 块并填写 **Privacy policy URL**。 |
| **The privacy policy URL must start with https:// or / — otherwise the site shows no link** | 以 `https://…` 的形式或以您网站上以 `/` 开头的路径形式输入 URL。 |
| **Keep only one Email input** | 删除多余的 **Email input**。 |
| **Choose a tag in every Tag input** | 在每个 **Tag input** 中选择一个标签，或删除空字段。 |
| **Tag “…” is chosen in more than one field** | 在其中一个字段中选择其他标签。 |
| **“…” is a reserved tag — a form can't write `PW_FF_*` tags** | 选择其他标签。 |
| **The form needs exactly one success page** | 保留一个 **Success** 页面。 |
保存时，Pushwoosh 还会检查每个已选择的标签。如果某个标签已被删除或隐藏，或其名称以 `PW_FF_` 开头，则表单不会被保存，并且错误消息会指出该标签，例如 `Tag "City" must be an existing, non-hidden tag, not PW_FF_*, used once`。请在该字段中选择其他标签。
## 在您的网站上显示表单
表单只有在处于活动状态的网页营销活动中才会出现在您的网站上。您可以在多个营销活动中使用同一个表单。**Popup** 营销活动会将表单显示在页面上方，**Inline** 营销活动会将其显示为页面元素内的一个块。
开始之前，请让您的开发人员：
- 确认您的网站运行的是 [Web SDK](/zh/developer/pushwoosh-sdk/web-push-notifications/web-push-sdk-30/#inline-campaigns-and-web-forms) 3.99.0 或更高版本。较旧的 Web SDK 显示表单时不会显示其字段。
- 如果您计划使用 **Inline** 营销活动，请添加营销活动要放置到的页面元素。请参阅 [CSS 选择器](/zh/product/messaging-channels/web-popups/create-web-popups-campaigns/#css-selector)。
然后创建营销活动：
1. 前往 **Campaigns → Web campaigns**。
2. 点击 **Create campaign** 并选择 **Popup** 或 **Inline**。
3. 在 **Web content** 中，选择您的表单。表单名称下方会显示 **Web form**。
4. 设置受众和显示设置。
5. 启动营销活动。
有关每个步骤的说明，请参阅[创建网页弹窗营销活动](/zh/product/messaging-channels/web-popups/create-web-popups-campaigns/)。
## 使用双重选择加入确认电子邮件
当项目启用了双重选择加入时，提交电子邮件的访问者会收到一封确认电子邮件，并且只有在点击其中的链接后才会被订阅。确认链接的有效期为 24 小时。访问者确认后，Pushwoosh 会为该电子邮件地址保存表单的标签值。
- 如果访问者在未确认期间在同一营销活动中再次提交相同的地址，Pushwoosh 会再次发送确认电子邮件，但最多每五分钟发送一次。只有最新一封电子邮件中的链接有效。
- 已通过项目的任何网页营销活动确认过的地址会被立即订阅，不会再发送确认电子邮件。通过 **Audience → Subscription forms** 中的订阅表单完成的确认在此不计算在内。
- 确认电子邮件需要一个已验证的发件域名。在您的账户没有已验证域名期间，Pushwoosh 会拒绝每一个需要发送确认电子邮件的提交，访问者会看到 **Submit error text**。
- 如果您的套餐不包含电子邮件，访问者点击链接时该地址不会被订阅，并保持未确认状态。此失败不会出现在营销活动的提交失败记录中。
双重选择加入是项目中订阅表单和网页营销活动表单共用的一项设置。请参阅[使用双重选择加入确认订阅者](/zh/product/audience-data-and-segmentation/subscription-forms/double-opt-in/)。
## 跟踪表单结果
从 **Campaigns → Web campaigns** 打开营销活动的统计信息，查看有多少访问者提交了表单、提交失败的原因，并导出订阅者。