首页 » 未分类 » 如何在 WordPress 中创建自定义用户注册表单

如何在 WordPress 中创建自定义用户注册表单

您想在 WordPress 中创建自定义前端用户注册表单吗?

默认的 WordPress 用户注册表单显示 WordPress 品牌,但与您网站的主题不匹配。

在本文中,我们将向您展示如何在 WordPress 中轻松创建自定义用户注册表单。

如何创建用户注册表

为什么要在 WordPress 中添加自定义用户注册表单?

默认的 WordPress 用户注册页面显示 WordPress 品牌和徽标,这与WordPress 网站设计的其余部分不匹配。

创建新的用户注册表单允许您在 WordPress 网站的任何页面上添加注册表单,并帮助您在注册过程中提供更一致的用户体验。

通过注册表,您可以从用户那里收集可能是您的WordPress 博客或企业独有的特定信息。

这可能包括其他联系方式、偏好设置或与您网站功能相关的任何其他信息。

例如,如果您正在组织一项活动,那么注册表将帮助您收集与会者的基本详细信息,例如饮食限制、会议偏好或特殊要求。

自定义用户注册表单还允许您在注册时重定向用户。您还可以显示其他用户配置文件字段,将它们与自定义前端登录表单结合起来,并将其与您的电子邮件营销服务连接。

话虽如此,让我们来看看如何在 WordPress 中创建自定义用户注册表单。

如何在 WordPress 中创建自定义用户注册表单

创建自定义用户注册表单的最简单方法是使用WPForms。它是市场上最好的 WordPress 联系表单插件,允许您在 WordPress 中创建所有类型的表单。

WPForms 非常易于使用,并提供拖放表单生成器,因此您可以使用它按照您想要的方式自定义注册表单。该插件还集成了流行的电子邮件营销服务和 PayPal 等支付服务。

首先,您需要安装并激活WPForms插件。有关更详细的说明,请参阅我们有关如何安装 WordPress 插件的分步指南。

注意: WPForms 还有免费版本。但是,您需要升级到本教程的插件的专业版,因为它包含用户注册插件。

激活后,从 WordPress 管理侧边栏前往WPForms » 设置页面,输入您的许可证密钥。

您可以从 WPForms 网站上的帐户获取此密钥。

输入 WPForms 许可证密钥

验证密钥后,您需要从 WordPress 仪表板访问WPForms » Addons页面。

从这里,找到“用户注册插件”,然后单击其下方的“安装插件”按钮。

安装用户注册和登录表单插件

WPForms 现在将在您的 WordPress 网站上安装并激活用户注册插件。安装插件后,您将看到状态更改为“活动”。

您现在已准备好创建自定义用户注册表单。

为此,您必须从管理侧边栏访问WPForms » 添加新页面。

这将引导您进入“选择模板”页面,您可以在其中首先输入要创建的表单的名称。

完成此操作后,只需找到“用户注册表”模板并单击其下方的“使用模板”按钮即可。

选择用户注册表模板

这将在您的屏幕上启动 WPForms 表单生成器。在这里,您会注意到右栏中的字段选项和屏幕左角的表单预览。

现在,默认注册表单已添加了姓名、用户名、密码、电子邮件和简短的个人简介字段。

但是,您可以轻松地从左侧面板向表单添加更多字段,也可以拖动字段以重新排列其顺序。

在用户注册表单中添加更多表单字段

该插件还允许您编辑每个表单字段。为此,只需单击任何表单字段,您就会看到“字段选项”出现在左栏中。

从这里,您可以更改字段标签、编辑其格式、添加说明、设置条件格式、将字段更改为必填字段等。

编辑字段选项

完成后,不要忘记单击顶部的“保存”按钮来存储您的用户注册表单设置。

在自定义用户注册表中添加自定义字段

WPForms 还允许您将自定义用户配置文件字段连接到您的用户注册表单。

为此,您需要向 WordPress 网站添加其他用户配置文件字段,最简单的方法是使用 WordPress插件

在本教程中,我们使用高级自定义字段插件。但是,WPForms 的字段映射功能可与任何使用标准 WordPress 自定义字段添加和存储用户元数据的插件配合使用。

首先,您需要安装并激活高级自定义字段插件。有关更多详细信息,您可能需要查看我们有关如何安装 WordPress 插件的初学者指南。

激活插件后,从 WordPress 管理侧边栏转到ACF » 字段组页面,然后单击“+ 添加字段组”按钮。

单击添加字段组按钮

这将引导您进入“添加新字段组”页面,您可以在其中首先键入字段组的标题。

在本教程中,我们将为社交媒体帐户详细信息创建一个自定义字段。

添加字段组名称

之后,向下滚动到“字段类型”下拉菜单,然后选择自定义字段的类型。您可以选择文本、数字、图像、文件、复选框、URL、密码等等。

完成此操作后,您需要输入将显示在个人资料页面上的字段标签。

例如,如果您想添加自定义字段来收集 Facebook 个人资料,则可以将字段标签命名为“Facebook”。

您会注意到,当您输入字段标签时,字段名称将自动生成,但您可以根据需要对其进行编辑。

选择字段类型和标签

接下来,从“标签”部分切换到“验证”选项卡。在这里,如果您希望用户在提交表单之前强制填写此自定义字段,则可以打开“必填”开关。

您甚至可以从此处设置字段的字符限制。

切换所需的开关并添加字符限制

完成此操作后,只需从顶部切换到“演示文稿”选项卡即可。

您现在可以添加作者说明、字段占位符文本、包装器属性等。

配置演示设置

之后,您还可以通过切换到顶部的“条件逻辑”选项卡,将条件逻辑添加到您正在创建的自定义字段中。

进行更改后,向下滚动到“位置规则”部分。从这里,您必须创建一组规则来确定哪些屏幕将使用这些自定义字段。

由于我们希望所有用户配置文件都显示此字段,因此我们必须从左侧的下拉菜单中选择“用户角色”选项。

之后,保留中间的下拉菜单不变,然后从右侧的下拉菜单中选择“全部”选项。

现在,我们正在创建的自定义字段组将为所有用户配置文件显示。

配置位置规则

接下来,从顶部切换到“组设置”选项卡。

到达那里后,通过将开关从“否”滑动到“是”来确保字段组处于活动状态。

切换活动开关

完成此操作后,您还可以通过单击页面顶部的“添加字段”按钮将其他自定义字段添加到字段组。

例如,如果您想创建多个社交媒体字段,则可以单击“添加字段”按钮并开始为其他社交媒体平台自定义字段。

请记住,您创建的所有字段都将属于同一字段组。

完成后,不要忘记单击顶部的“保存更改”按钮来存储您的设置。

您现在已经成功发布了您的字段组。

保存自定义字段组

现在,要查看您创建的自定义字段,请从管理区域转到用户»个人资料页面。

在这里,您将看到个人资料页面底部添加的自定义字段。

查看您的自定义字段

现在您已经创建了自定义用户配置文件字段,您必须将其添加到 WPForms 中的自定义用户注册表单中。

之后,您还必须确保将表单字段映射到自定义字段,以便正确存储数据。

为此,请从 WordPress 仪表板访问WPForms » 所有表单页面,然后单击您之前刚刚创建并保存的用户注册表单下的“编辑”链接。

这将在 WPForms 表单生成器中打开您的表单。到达那里后,只需从左侧面板拖动一个字段即可将其添加到您的表单中。

在此示例中,我们将“网站/URL”字段添加到表单中。

在您的注册表中添加网站字段

添加网站/URL 字段后,单击它以在左栏中打开字段的属性。

现在,继续将字段标签从网站/URL 更改为您创建的字段组的名称。

如果需要,您还可以添加该字段的说明。

编辑网站字段标签

之后,不要忘记单击屏幕右上角的“保存”按钮来保存表单。

接下来,您需要单击右上角的“设置”按钮进行高级表单设置和字段映射。在“设置”页面上,单击“用户注册”选项卡。

WPForms 现在将显示您的表单字段及其下方的下拉菜单,以选择要映射的 WordPress 注册字段。

您会注意到 WPForms 会自动映射您的默认字段,例如姓名、电子邮件、密码等。

在这里,从“网站”选项下的下拉菜单中选择您的字段组名称选项。

从网站下拉菜单中选择自定义字段

之后,向下滚动到“自定义用户元”部分。

您可以在自定义元键选项中输入之前创建的字段组的名称,然后从下拉菜单中选择要与其映射的自定义表单字段。

输入自定义用户元详细信息

最后,单击屏幕右上角的“保存”按钮保存您的设置。

在 WordPress 中添加自定义用户注册表单

WPForms 使向 WordPress 帖子、页面和侧边栏小部件添加表单变得非常简单。

首先,您需要打开要添加自定义注册表单的现有或新帖子/页面。

到达那里后,单击屏幕左上角的“+”按钮以打开阻止菜单。

从这里,找到 WPForms 块并将其添加到页面/帖子中。

将用户注册表单添加到块编辑器

之后,您可以从块本身的下拉菜单中选择自定义注册表单。

您现在将在 WordPress 编辑器中看到注册表单预览。继续发布您的帖子或页面以查看正在运行的自定义注册表单。

用户注册表单预览

将自定义用户注册表添加到侧边栏

WPForms 还允许您在侧边栏中添加自定义用户注册表单。只需从管理区域访问外观»小部件页面,然后单击左上角的“+”按钮即可。

这将打开块菜单,您可以在其中将 WPForms 块添加到“小部件”页面上的侧边栏选项卡。

之后,只需从 WPForms 块的下拉菜单中选择用户注册表单即可。

添加用户注册表单作为小部件

完成后,不要忘记单击“更新”按钮来存储您的设置。

现在您可以访问您的网站,在网站侧边栏中查看用户注册表单。

侧边栏中的用户注册表单预览

在完整站点编辑器中添加自定义用户注册表单

如果您使用的是基于块的 WordPress 主题,那么您将不会有小部件页面。要在侧边栏中添加带有 FSE 的注册表单,请从管理侧边栏转到外观 » 编辑器页面。

到达那里后,单击屏幕左上角的“+”按钮以打开块菜单。

从这里,您必须找到 WPForms 块并将其添加到您网站上的首选位置。

之后,从块本身的下拉菜单中选择注册表单。

在完整站点编辑器中添加用户注册表单

最后,单击“保存”按钮来存储您的设置。

现在访问您的网站以查看正在运行的自定义用户注册表单。

用户注册表单预览

使用注册表创建自定义登录页面

当您将注册表单添加到网站上的页面时,WordPress 将默认使用您主题的布局、模板和样式。

但是,您可以使用WordPress 登陆页面构建器从头开始创建令人惊叹的注册页面。

SeedProd是 WordPress 的最佳登陆页面构建器。它用户友好,并提供拖放构建器,可帮助您创建所有类型的登陆页面。该插件还提供预构建模板和许多自定义功能。

注意: SeedProd 还有一个免费版本可供您使用。但是,我们将在本教程中使用该插件的专业版,因为它包括用户登录页面模板和高级自定义功能。

首先,您需要在您的网站上安装并激活SeedProd插件。有关详细说明,您可能需要查看我们有关如何安装 WordPress 插件的教程。

激活后,访问SeedProd » 设置页面输入插件许可证密钥。您可以在 SeedProd 网站上的帐户中找到此信息。

粘贴许可证密钥

验证您的密钥后,您现在可以使用注册表单创建登录页面。

首先,从管理侧边栏转到SeedProd » 登录页面屏幕,然后单击“设置登录页面”按钮。

设置您的登录页面

这将带您进入“选择新页面模板”屏幕,您可以在其中为要创建的登录页面选择预制模板。

选择模板后,将出现一个弹出窗口。

您现在必须输入目标网页的名称和 URL。完成后,继续并单击“保存并开始编辑页面”按钮。

输入登录页面的名称和 URL

接下来,您可以使用 SeedProd 的拖放登录页面构建器编辑登录页面。

为此,请从左侧菜单中选择一个块,并将其拖动到登录页面上要添加的位置。

例如,您可以向着陆页添加标题、图像、视频或社交共享块。

将块添加到您的登录页面模板

完成此操作后,请从左栏转到高级块部分。

从这里,选择“联系表单”块并将其放置在您的登录页面上。

我们建议您从模板中删除现有的用户名和密码块,以便用户不必输入两次登录凭据。

添加联系表单块

接下来,单击登录页面上的 WPForms 块,将其设置写入左栏中。

现在,您将在菜单中看到“选择表单”的选项。

从这里,继续从下拉菜单中选择您的注册表单。

在 SeedProd 中选择您的注册表

您现在应该在登陆页面构建器中看到注册表单的预览。

最后,不要忘记单击“保存”按钮来存储您的更改。

登陆页面构建器中的注册表单预览

之后,您可以转到“连接”选项卡,并将不同的电子邮件营销服务与您的注册表集成。

SeedProd 可以轻松地与DripConstant ContactAWeber等流行的电子邮件营销服务集成 ,这可以帮助改善您的电子邮件列表。

连接电子邮件营销服务

接下来,您可以转到“页面设置”选项卡,然后将“常规”设置下的“页面状态”更改为“发布” 。

您甚至可以编辑页面标题和 URL,并从此选项卡启用 SeedProd 链接。

从页面设置发布您的登录页面

如果您想针对搜索引擎优化页面,请转到 SEO 选项卡。

在这里,您可以通过输入 SEO 标题、描述、社交媒体缩略图等来配置设置。

SeedProd 还允许您在脚本设置下添加代码片段。对设置感到满意后,只需单击顶部的“保存”按钮并关闭页面构建器即可。

使您的登录页面处于活动状态

之后,前往SeedProd » 登陆页面屏幕并切换登录页面下方的开关以使您的页面处于“活动状态”。

您现在可以访问登录页面以查看正在运行的注册表单。

注册表登陆页面预览

我们希望本文能帮助您了解如何在 WordPress 中轻松添加自定义用户注册表单。您可能还想查看我们关于如何选择最佳网站构建器的初学者指南或我们对小型企业最佳实时聊天软件的比较。

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注

Scroll to Top