如何在WordPress(简单路)中以单行中显示表单

您想在单行中显示表单吗?

单行形式为您提供更灵活的表单展示位置.这意味着您可以轻松地为您网站的高流量区域添加表格并提高转换.

在本文中,我们将向您展示如何在WordPress中的单行中显示表单.

How to display your form in a single line in WordPress (easy way) How to display your form in a single line in WordPress (easy way)

为什么在WordPress中显示单线形式?

单行表单在选择放置表单的位置时会为您提供更大的灵活性.由于这种形式风格只是单行,因此它们不会占用太多空间,并且可以轻松地与您现有的内容集成.

电子邮件通讯注册表单通常以博客文本内容之上或下方的单行中显示.单线形式也在登陆页面,联系页面和您网站上的其他重要页面上工作.

除了生成更多订阅者和引线,您可以将任何形式转换为单行形式.例如,在单行中显示联系人表单可能有意义,以保存页面上的空间.

所说,让我们向您展示如何在WordPress网站上显示单行形式.

在WordPress

中创建单行形式

对于本教程,我们将使用WPForms插件来创建单行形式.它是超过500万个网站使用的WordPress的最佳领先生成插件.

WPForms WPForms

您可以使用拖放构建器快速为您的网站创建任何表单.此外,它与流行的电子邮件营销工具集成,因此您可以轻松地发展您的电子邮件列表.

有一个高级版本的插件具有更多功能,但我们将使用本教程的Lite版本,因为它允许您创建一个简单的表单,并将其连接到持续的联系人以获取引导生成.

您需要执行的第一件事是安装并激活插件.有关详细信息,请参阅如何安装WordPress插件的初学者指南.

之后,转到 wpforms»在WordPress管理面板中添加新,并为您的表单提供名称.然后,您需要选择表单模板.

我们将选择"选项表单"模板.只需将鼠标悬停在模板上,然后单击"使用模板"按钮.

Select form template Select form template

这会带来拖放表单构建器.

您将看到我们选择的模板自动包含名称和电子邮件字段和提交按钮.

WPForms drag and drop form builder WPForms drag and drop form builder

可以通过单击它们并在左侧列中进行更改来编辑每个字段.

您还可以拖放字段以更改其订单.

WPForms form editor panel WPForms form editor panel

完成自定义字段后,您可以在单行中显示表单.

要执行此操作,请转到设置»一般,然后单击"高级"下拉选项卡.

Go to form advanced settings Go to form advanced settings

next,在"表单CSS类"框中键入"内联字段"(没有引号).

这将将CSS类应用于表单.由于WPForms包括对"内联字段"类的样式,因此它将自动在单行上显示整个表单.

Add inline CSS class Add inline CSS class

在此之后,您可以通过隐藏现场标签来使您的表格更小.

只需单击"字段"导航选项,然后选择"高级"菜单选项,然后单击"隐藏标签"切换以将其打开.

Hide form labels toggle Hide form labels toggle

然后,您需要为所有表单字段标签做同样的事情.

之后,在相同的"高级"部分中,您可以在"占位符"框中输入文本.

这告诉您的用户每个表单字段是什么.

Add form placeholder text Add form placeholder text

完成自定义表单后,请务必单击"保存"按钮以保存更改.

如果您使用表单来生成引线,则可以将您的表单连接到电子邮件营销提供商.有关更多详细信息,请参阅我们关于如何创建电子邮件时事通讯的指南.

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

现在,是时候将单行形式添加到您的网站时.您可以将其添加到任何页面,帖子或小部件区域.

我们要将它添加到现有页面,但如果您将其添加到WordPress博客的另一个区域,此过程将是类似的.

只需打开要显示单行形式要显示的页面,单击"加号"添加块图标,并搜索"WPForms".

Add WPForms block Add WPForms block

然后,单击"WPForms"块将其添加到您的网站.

这会带上一个下拉框以选择您之前创建的单行形式.

Select single line form from drop down Select single line form from drop down

选择表单后,插件将在内容编辑器内加载表单的预览.然后,单击"更新"或"发布"按钮以使您的新表单直播.

现在,您可以访问您的网站,查看您的新表格.

Single line form example Single line form example

我们希望这篇文章有助于您了解如何在WordPress中的单行中显示表单.您可能还希望查看我们的指南如何获取免费电子邮件域,以及我们的专家选择具有免费选项的最佳虚拟商务电话号码应用程序.

如果您喜欢本文,请订阅我们的YouTube频道以获取WordPress视频教程.您还可以在推特和Facebook上找到我们.

6

发表回复