首页 » 博文 » wpbeginner » 最佳插件 » 如何在 WordPress 表单中添加图像选择(提高参与度)

如何在 WordPress 表单中添加图像选择(提高参与度)

您想在 WordPress 表单中添加图像选择吗?

图像不仅仅是显示文本选项,还可以立即使您的 WordPress 表单更具吸引力。这可以帮助提高您的回复率和表单转化率。

在本文中,我们将向您展示如何在 WordPress 表单中轻松添加图像选项以提高用户参与度。

如何在 WordPress 表单中轻松添加图像选择

为什么在 WordPress 表单中使用图像选择?

图像选择是用户在WordPress 网站上填写表单时可以选择的照片、插图、图形或图标。

下面是使用图像选项而不是常规文本选项的表单示例。第一个选择,草莓,已被选中:

表单中使用的图像选择示例:显示 6 种水果选项的彩色图像

图像选择可以使您的表单看起来更加精美、专业且具有视觉吸引力,这可以帮助用户更快地做出决定。

例如,如果您经营一家提供送货服务的餐厅网站,那么您会希望在您的网站上有一个订单表格。您现在可以使用不同菜肴的图像来帮助潜在客户选择他们想要的东西。

除此之外,图像选择还可以让有阅读困难的受众或不熟悉您的语言的人更轻松地填写您的表格。

话虽如此,让我们看看如何在 WordPress 表单中轻松添加图像选择。

视频教程

https://www.youtube.com/embed/UW5vvlTOYyg?version=3&rel=0&fs=1&showsearch=0&showinfo=1&iv_load_policy=1&wmode=transparent订阅 WPBeginner

https://www.youtube.com/subscribe_embed?usegapi=1&channel=wpbeginner&layout=default&count=default&origin=https%3A%2F%2Fwpbeginner.com&gsrc=3p&ic=1&jsh=m%3B%2F_%2Fscs%2Fapps-static%2F_%2Fjs%2Fk%3Doz.gapi.en.vQiXRrxCe40.O%2Fam%3DAQ%2Fd%3D1%2Frs%3DAGLTcCMBxIGVyXSdvvcs43a64yHt_P7dfg%2Fm%3D__features__#_methods=onPlusOne%2C_ready%2C_close%2C_open%2C_resizeMe%2C_renderstart%2Concircled%2Cdrefresh%2Cerefresh&id=I0_1448178294715&parent=https%3A%2F%2Fwpbeginner.com

如果您更喜欢书面说明,请继续阅读。

如何向 WordPress 表单添加图像选择

您可以使用WPForms轻松地将图像选项添加到 WordPress 表单中。

它是市场上最好的 WordPress 表单生成器插件,允许您使用简单的拖放表单生成器轻松创建表单。

首先,您需要安装并激活WPForms插件。有关详细说明,您可能需要查看我们有关如何安装 WordPress 插件的分步指南。

注意:您还可以使用WPForms Lite,它可以完全免费地向您的表单添加图像选择。但是,我们将使用专业版,因为它具有更多功能。

插件激活后,前往WordPress 仪表板中的WPForms » 添加表单页面以创建新表单。

这将带您进入“选择模板”页面,您可以在其中输入表单的名称。

之后,单击您选择的预制模板下的“使用模板”按钮。在本教程中,我们将使用“简单联系表单”模板。

WPForms 联系人模板

这将启动 WPForms 表单生成器界面,您将在屏幕右侧看到表单预览,并在左角看到包含表单字段的列。

现在,您可以通过单击、上下移动或删除来编辑您选择的任何表单字段。

有关更详细的说明,您可能需要查看我们有关如何在 WordPress 中创建联系表单的教程。

使用 WPForms 的联系表单模板创建的默认表单

接下来,您必须将左列中的多项选择字段添加到表单预览中,以便您可以为客户创建图像选择。

我们将把它放在“评论或消息”框的上方。

注意:图像选择也适用于复选框字段。如果您希望用户能够选择多个选项,请使用它。

向表单添加多项选择字段

之后,单击“多项选择”字段进行编辑。这将打开屏幕左侧的字段选项。

您现在会注意到,该字段默认允许您添加文本选项。

编辑表单的多项选择字段

但是,您可以通过切换“使用图像选择”开关轻松更改该设置。

完成此操作后,每个多项选择字段下方都会出现一个“上传图像”按钮。

切换图像选择开关

接下来,您可以在字段文本标签中输入所需的内容,然后单击“上传图像”按钮。

您现在可以从计算机上传图像或从 WordPress 媒体库中选择一张图像。

上传表单上不同选择的图像

我们建议使用不超过 250 像素 x 250 像素的 .jpg 或 .png 图像。

请记住,如果您的图片尺寸相同,那么它们在您的表单中看起来会最好。

重要提示: WPForms 不会调整您的图像大小。上传之前,您需要确保它们的大小符合您的要求。或者,您可以先在 WordPress 中编辑图像,然后再将其添加到表单中。

如果要包含的选项超过 3 个,只需单击 (+) 按钮即可添加新选项。您还可以使用 (-) 按钮删除选择。

单击 - 按钮删除多项选择字段

更改您的图像选择在表单中的显示方式

WPForms 可以轻松更改图像选择字段的布局和其他设置。

为此,请转到左栏中的“高级”选项卡。

如果您想随机而不是按特定顺序显示图像选择,您现在可以切换“随机选择”开关。

如果您正在创建调查并希望消除结果中的首选偏差,这非常有用。

切换随机选择开关

如果需要,您还可以使用“选择布局”下拉列表更改选择的布局方式。

默认设置为“内联”,您的选择会彼此相邻出现,直到换行。

您可以选择在多列中显示您的选择。如果您想要垂直列表,只需从下拉列表中选择“一列”即可。

这里还有“隐藏标签”选项供您选择图像。这意味着图像下方不会有任何文字。在某些情况下,这样做可能是有意义的。

例如,您可能会要求人们投票选出他们最喜欢的新徽标设计。

不过,请确保您尽可能输入相关且有用的标签。这将显示为图像的替代文本,使视障用户更容易访问您的网站。

选择选择布局

完成此操作后,从左列切换回“常规”选项卡,然后向下滚动到“图像选择样式”部分。

从这里,您可以从下拉菜单中选择如何设置图像样式。

选择图像选择风格

默认样式为“现代”,其中所选图像将出现一个复选标记。

但是,您可以选择经典样式,当选择一个选项时,它看起来像这样:

应用经典样式的图像选择(较粗的边框,无阴影,无粗体文本,无复选标记)

或者,您也可以选择“无”样式。

在这种情况下,您的图像将只是没有边框或其他样式的常规图像。标签将与单选按钮一起显示。

没有样式的图像选择

一旦您对表单感到满意,只需单击屏幕顶部的“保存”按钮即可。

将您的表单添加到您的网站

只需点击几下,您就可以将表单添加到网站上的任何帖子或页面。我们将为我们创建一个新页面。

首先,从 WordPress 管理侧边栏访问页面 » 添加新屏幕,然后单击屏幕左上角的“+”按钮。

这将打开块菜单,您必须在其中找到 WPForms 块并将其添加到页面。

从 WPForms 块的下拉菜单中选择一个表单

之后,从 WPForms 块的下拉菜单中选择您刚刚创建的表单。

最后,单击“发布”或“更新”按钮来存储您的表单设置。

现在访问您的网站以查看 WordPress 表单中的图像选择。

在 WordPress 表单中添加图像选项的预览

如果您想对表单进行更多更改,则可以通过访问 WordPress 仪表板中的WPForms » 所有表单页面轻松完成此操作。

到达那里后,单击您的表单以在表单生成器中将其打开。

进行更改后,只需单击“保存”按钮即可存储您的更改。您的表单也会在您的页面上自动更新。

编辑图像选择表格

我们希望本文能帮助您了解如何在 WordPress 表单中添加图像选择。您可能还想查看我们关于如何在 WordPress 中创建调查的初学者指南以及我们对最佳 WordPress 页面构建器插件的比较。

发表评论

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

Scroll to Top