如何在 WordPress 注册表中通过 Select2 添加选择字段?

已发表: 2023-02-27

如果您想创建高级注册表单,您可以使用 Select2 WordPress 字段而不是 Select 字段。

想知道如何做到这一点? 好吧,你来对地方了!

在本文中,您将了解什么是 WordPress Select2 字段、它的意义以及它与标准 Select 字段的区别。

我们还将逐步完成将字段添加到注册表单的过程。 所以,一定要看完文章!

目录

什么是 Select2? 它与标准选​​择有何不同?

简单来说,Select2 技术为您提供了可自定义的选择字段。 这意味着您可以将搜索、标记、无限滚动等功能添加到“选择”字段。

现在,您一定想知道 Select2 字段与标准 Select 字段有何不同。 让我们找出答案!

选择与选择 2

标准选择字段在下拉列表中显示可用选项列表。 用户可以通过滚动查找选项来选择这些选项之一。

选择示例

Select2 字段具有标准 Select 字段提供的所有操作。 因此,它还允许用户选择可用选项之一。

然而,Select2 提供了更多的灵活性和定制化。

它为用户提供了一个搜索框,他们可以在其中输入选项。 然后自动向用户显示匹配选项。

选择 2 示例

此外,与标准 Select 字段不同,Select2 字段还有助于标记和无限滚动。


Select2 与 Multi Select2

Select2 技术支持单值和多值选择框。 单值选择框简称为 Select2 字段。

另一方面,多值选择框称为多选 2 字段或 Pillbox。

它们的工作方式非常相似; 它们都支持可定制的选择框。

唯一的主要区别是 Multi Select2 允许用户从可用选项中选择多个选项。 用户选择的所有选项都出现在框内,就像药丸盒一样,因此得名。

多选 2 示例

此功能不存在于常规 Select2 字段中。


为什么要在注册表中添加 Select2 WordPress 字段?

Select2 字段的介绍帮助您更好地理解这项技术。

但是它给注册表增加了什么价值呢? 为什么不直接使用标准的 Select 字段进行注册呢?

好吧,让我们看看您应该将 Select2 WordPress 字段添加到注册表单的几个原因:

  • Select2 字段可帮助用户使用搜索框轻松找到正确的选项。
  • 用户不需要滚动整个列表来找到他们正在寻找的选择。
  • 您可以让用户搜索并选择多个选项。
  • 该字段支持无限滚动,因此当用户向下滚动时选项会继续加载。
  • Select2 字段使用户可以快速轻松地完成注册过程。
  • 出色的用户体验鼓励用户填写并提交注册表。

这就是为什么我们建议您将 Select2 字段添加到注册表单而不是标准的 Select 字段。

将 Select2 字段添加到自定义表单的最佳方式是什么? 让我们在下一节中探讨它。


在注册表中添加 Select2 字段的最佳方式

WordPress 不允许您在没有大量编码的情况下将 Select2 字段添加到默认注册表单。

但是,当您可以更轻松地使用 Select2 字段时,为什么还要依赖编码呢?

用户注册插件可帮助您在注册表单中插入和自定义 Select2 和 Multi Select2 字段,而无需编码。

用户注册表插件

您所需要的只是其高级字段扩展。 这就是为什么它是将 Select2 字段添加到注册表单的最佳方式。

进阶领域

此外,User Registration 是一个注册表插件。

因此,您可以为您的站点创建带有 Select2 字段的无限自定义注册表单。 拖放式构建器界面使过程超级快!

此外,用户注册是 WooCommerce 网站的完美补充。 这个令人难以置信的 WordPress 插件可帮助您创建自定义 WooCommerce 注册表格并将它们与结帐页面同步。

这些只是用户注册插件的几个亮点。 如果您想了解有关此插件的更多信息,请访问官方页面。

现在,让我们继续分步指南,其中我们将使用用户注册来演示该过程。


如何在 WordPress 注册表中添加 Select2 字段?

这是在注册表中添加 WordPress Select2 字段的完整指南。

仔细执行所有步骤,您应该立即准备好带有 Select2 字段的自定义注册表单!

第 1 步:设置用户注册专业版

在您的网站上安装和激活 User Registration Pro 是第一步。 它是免费用户注册插件的高级版本。

要获得 pro 插件,请从 User Registration 的官方网站购买三种定价计划中的任何一种。

然后,在您的网站上设置 User Registration Pro。 如果您需要帮助,请按照我们关于如何正确安装用户注册的指南进行操作。

成功设置插件后,您可以继续下一步。


第 2 步:安装并激活 Advanced Fields 插件

User Registration Pro 让您可以访问 Advanced Fields 插件。

顾名思义,它向表单构建器添加了几个高级字段,包括 Select2 和 Multi Select2 字段。

进阶领域

因此,要使用它们,您必须安装并激活Advanced Fields插件。

您可以从 WordPress 仪表板上的用户注册 >> 扩展页面轻松完成此操作。

打开用户注册扩展

在这里,搜索插件并单击其安装插件按钮。 安装完成后,点击激活按钮。

安装高级字段插件

现在,您已准备好在注册表中使用 Select2 WordPress 字段。


第 3 步:使用 Select2 字段创建一个新的注册表单

在第三步中,让我们创建一个新的注册表单,您可以在其中添加 Select2 字段。

首先导航到用户注册 >> 添加新的

添加新用户注册

如您所见,您可以选择一个预先设计的模板来快速启动。

用户注册提供各种模板,例如学生注册表广告提交表单等。

添加新的表单模板

否则,您可以从头开始构建注册表单。 单击从头开始并为表单命名。

选择 2 WordPress 注册表格标题

Continue后,您将被带到拖放式表单生成器。

该表单有四个默认字段: UsernameUser EmailUser PasswordConfirm Password

拖放注册字段

您可以将所需的其余字段从左侧拖到右侧的表单中。 您还可以通过简单地四处拖动来重新排列字段的位置。

最重要的是,确保您还将 Select2 字段添加到表单中。

添加 WordPress Select2 字段

用户注册带有两种类型的 Select2 字段: Select2Multi Select2 。 您可以根据需要将这些字段中的任何一个添加到表单中。

完成后,按顶部的更新表单按钮。

更新 Select2 WordPress 表单

因此,您已经使用 Select2 WordPress 字段创建了一个新的注册表单。


第 4 步:自定义 Select2 和 Multi Select2 字段

用户注册的最大好处是您可以自定义添加到表单中的所有字段。

您所要做的就是单击要编辑的字段,其字段选项将在左侧打开。

因此,单击您添加的 Select2 字段。 从其Field Options ,您可以编辑以下设置:

常规设置

在此部分中,您可以编辑字段标签、说明等。您还可以将字段设置为必填字段、隐藏其标签或启用工具提示。

Select2 WordPress 字段选项

此外,选项部分可帮助您添加、编辑和删除选项。 单击+添加一个选项,单击将其删除。 您可以通过编辑文本框来更改选项名称。

编辑 Select2 选项

此外,您可以通过向上或向下拖动来重新排列选项。 如果您有很长的选项列表,该插件可以让您批量添加它们。


高级设置

高级设置允许您为该字段添加自定义 CSS 类。 您还可以通过提供参数名称允许动态填充该字段。

选择 2 高级选项

请务必注意,每个表单域的域选项都不同。

例如, Multi Select2字段具有类似的General Settings 。 但是,高级设置提供了两个新选项:

多选 2 高级选项
  • Choice Limit:设置用户可以选择的最大选项数。
  • 全选:使用户能够选择列表中的所有可用选项。

因此,相应地自定义每个字段并点击更新表单按钮。


第 5 步:配置注册表单设置

在您配置表单设置之前,您的注册表单是不完整的。

为此,请转到构建器中的“表单设置”选项卡。 在这里,您可以配置两种类型的设置: GeneralExtras

注册表单的常规设置

General部分允许您选择User Approval And Login OptionDefault User RoleForm Template等。

您还可以启用强密码和验证码支持。 除此之外,您还可以设置Redirect URLSubmit Button TextForm Class等等。

Extras设置允许您启用键盘友好表单激活蜜罐垃圾邮件保护启用白名单/黑名单域等。

注册表附加设置

完成配置后,请按“更新表单”按钮。


第 6 步:在您的网站上显示自定义注册表

最后,您的带有 Select2 字段的注册表已准备好发布到您的网站上。

为此,请打开现有页面或张贴您要显示自定义表单的位置。

这样做会将您带到古腾堡编辑器。 在这里,单击块插入器并将用户注册块添加到页面。

选择用户注册块

然后,选择注册表单选按钮并从下拉列表中选择您之前创建的表单。

选择Select2注册表

最后,点击顶部的更新按钮,使表单在您的网站上生效。

如果您要创建新页面或帖子,请按照与上述相同的步骤操作。 然后,点击最后的发布按钮。

恭喜! 现在,您的网站有一个带有 Select2 WordPress 字段的自定义注册表单。


包起来!

我们关于如何在注册表单中添加 Select2 WordPress 字段的文章到此结束。

总而言之,您可以添加 Select2 字段而不是标准的 Select 字段来创建更高级的注册表单。

用户注册插件可以帮助您轻松做到这一点。 您需要做的就是将 Select2 和 Multi Select2 字段添加到您的表单并自定义它们。

除此之外,用户注册同样有助于防止垃圾邮件注册、将默认登录 URL 更改为自定义 URL 等。

通过我们的博客了解有关此强大插件的更多信息。 您还可以在我们的 YouTube 频道上查看视频教程。

此外,请在 Twitter 和 Facebook 上关注我们,随时了解新文章的最新动态。