如何在 WordPress 中创建在线 T 恤订单表 [简单易行]

已发表: 2022-07-06

您是否打算开设在线 T 恤业务？或者尝试为您的亲密伙伴或您的组织制作定制的 T 恤。单独获取每个人的设计或颜色偏好是很烦人的。此外，询问每个人的 T 恤尺码也没有效率。

那么，你需要什么？您需要制作一个在线 T 恤表格，任何人都可以在其中选择设计、选择 T 恤的颜色和尺寸、选择您希望运送 T 恤的地址、付款方式等等。

Fluent Forms 是最适合初学者的表单构建器。立即下载并开始免费制作精美的表格！！！

您可能会在网上找到一些 T 恤订单表格模板，但所有这些都不会让您完全满意。模板很棒，但也有一个很大的挫折，你可能一开始就找不到你想要的所有必要字段。此外，您必须根据需要对其进行设计和集成。

那么，为什么不创建一个没有任何模板的 T 恤订单表格，自定义和排列字段，设计布局，添加功能，并使其成为您自己的 T 恤表格模板。最好的事情是你可以在没有任何手工编码的情况下做到这一点。

用于制作在线 T 恤订单的表单生成器

如果您需要制作有创意且漂亮的 T 恤订单表格，您肯定需要一个强大的表单生成器插件。在不编码的情况下创建在线表单时，没有什么比 Fluent Forms 更好的了。在进入表单构建之前，选择 Fluent Forms 来制作您可能会问的所需在线 T 恤订单表格有什么好处？

干得好 -

处理批量提交：市场上对T恤订单的要求很高。因为每个人都想为他们的帮派定制一件 T 恤。服装公司还使用这些表单构建器从客户那里获得订单。因此，他们需要一个可以处理批量提交、具有所有必要字段和功能、发票 pdf 生成器等的工具。

大量输入字段：创建在线 T 恤订购表的必填字段-

名称字段
地址字段（自动完成和谷歌地图集成）
电子邮件字段
复选框和多项选择
付款字段
上传文件
用于选择颜色、设计、尺寸等的下拉字段。
中继器字段

此外，您将获得40 多个输入字段，不包括这些字段，以制作您想要的任何类型的在线表格。查看如何使用 Fluent Forms 制作支票申请表。

重要功能和集成：您可能需要在表单中包含条件逻辑，或者可能需要一些计算器来帮助您的客户跟踪他们的预算，或者可能需要一些 T 恤的视觉效果，所有这些都可以使用 Fluent Forms 完成。

此外，下载提交条目的 PDF 版本是任何在线订单的一个重要功能。用户可能需要发票，您可以将发票与他们订购的 T 恤一起发货。

如果您想将您的潜在客户或一次性客户培养成永久忠诚的客户，您可能需要某种客户关系管理或 CRM 工具来为您的表单构建器，是的，Fluent Forms 有一堆本地集成来培养潜在客户。

此外，您将获得 45 多种集成，从自动化到文件共享工具，从会员资格到通知工具等等。

废话不多说，让我们开始制作表格。

如何创建在线 T 恤订单表（从头开始）

这些是创建简单而完整的 T 恤订单表格的步骤。只需跟随，让您的在线 T 恤业务顺利启动并运行！

第 1 步：创建在线 T 恤订单表格

要制作无需任何编码的在线 T 恤订单，您需要做的第一件事就是在您的 WordPress 网站上安装表单生成器。安装 Fluent Forms 非常简单。

安装并激活插件后，将鼠标悬停在左侧的 Fluent Forms 上，然后选择 Add New 以创建您的表单。现在将出现一个弹出窗口，选择新建空白表单选项来初始化您的新表单。

您将看到一个祝贺弹出窗口，并将被重定向到表单编辑器页面。在此页面上，您可以根据需要添加、删除和自定义表单字段。

这是您必须决定表单结构的地方。有的喜欢直接跳转到T恤设计版块，有的喜欢先获取用户的基本信息。

与后者一起，我们将一一添加姓名、地址、电子邮件和电话号码字段。这是非常基本的东西，只需从编辑器页面的右侧搜索该字段，然后单击以将其添加到您的表单中。您还可以拖动字段以随机播放它们。

至于名称，我们将只添加名字和姓氏，您可以从输入自定义中启用中间名选项。你还能定制什么？对于地址字段，您可以添加或删除辅助地址，排除不必要的信息归档，或者根据需要添加 Google 地图自动填充功能。

第 2 步：制作 T 恤款式定制版块

现在，对于您的定制 T 恤，您需要选择所需衬衫的尺寸、颜色和数量。因此，我们将添加一个三列容器并添加一个启用单选选项的付款字段、与付款字段映射的项目数量字段，以及一个名为选择颜色的下拉字段（我们在其中创建了选项不同的颜色）。

现在，如果有人想订购另一件不同尺寸和颜色的 T 恤怎么办？是的，我们也可以这样做。使用条件逻辑的一个简单技巧，您可以添加另一个具有相同字段的容器。

添加一个复选框并将其命名为 Add T-shirt，然后复制早期的容器并将其重命名为 T-shirt 2。根据屏幕截图设置条件逻辑。现在，每当用户检查此字段时，都会出现一个新容器，他/她可以在他/她的订单中添加另一个 T 恤需求。

第 3 步：为您的 T 恤订单定制付款部分

在 Fluent Forms 中设置 T 恤订单的付款选项非常简单。为您的订单添加付款方式和付款摘要字段。就是这样，它将动态获取数量和金额，并在付款摘要中显示小计和其他信息。

为了增加趣味性，我们将添加一个自定义字段以作为确认消息显示到 T 恤订单表单。首先，添加一个自定义字段并添加您的确认消息。然后获取动态数据非常简单。键入 {dynamic.Name_Attribute} 以获取该特定字段的数据。

对于支付方式，Fluent Forms 为您提供最流行的支付集成。您可以使用 Stripe、PayPal、Mollie、RazorPay 等进行 T 恤订单付款。设置您的付款方式就像任何其他付款设置一样。您需要通过 API 密钥集成它。

第 4 步：如果需要，可以将其设为多步骤表单

现在如果用户在一页上看到这么多字段可能会让人不知所措，您可以将表单分成多步表单，并为用户的联系信息和帐单地址、基本信息、付款部分和确认部分制作多个部分。形式。

从 Input Fields 中搜索 Form Step，然后在页首和页尾添加，在账单信息后添加一个，在 T 恤选择后添加一个。

第 5 步：T 恤订单表格的通知和电子邮件设置

现在，下订单后会发生什么？如果您想在提交 T 恤订单后向您的用户发送电子邮件通知并为自己收到电子邮件通知，您需要启用电子邮件通知。为此，请从“设置和集成”选项卡中打开“电子邮件通知”。单击顶部的添加通知并根据需要填充字段。我们建议您遵循电子邮件通知的最佳做法以避免电子邮件送达率问题。

您可能已经在屏幕左侧看到了其他可用选项。是的，如果您愿意，您可以将您的表单与会员、通知、CRM 等软件等不同工具集成。

第 6 步：设计您的 T 恤订单表格

如果您到目前为止都按照我们告诉您的所有内容进行操作，那么您将获得一份功能齐全的 T 恤订购单。如果需要，您可以在任何地方使用它，例如在博客或页面上。此外，您可以为此表单创建一个登录页面，该页面可以通过直接链接或按钮共享。

但是给这个表格一些风格呢？是的，您也可以这样做，通过自定义 HTML 字段将一些特色图像添加到您的表单是非常基本的。如果您使用 Elementor 和 Oxygen 等页面构建器，您将获得一些用于 Fluent 表单的额外小部件。让您的表单看起来如此丰富以至于用户通常无法滚动而无需再次查看，这可能非常方便。

这是一个基本的 T 恤订单表格，没有任何编码或花哨的页面构建器的帮助 -

在预览和设计选项中，您将有一些选项来更改背景颜色、字体颜色、容器设计等。甚至它为您的 T 恤订单提供了一些表单样式模板——现代、经典、引导样式等。

但是，如果您想在表单中添加一些自定义 CSS 和 JS，也可以。手动编码表单样式不是强制性的。您可以在没有任何 CSS 或花哨的页面构建器的情况下制作漂亮的表单。

还记得动态获取数据到确认页面以确保安全吗？
只需键入{dynamic.Name_Attribute}即可获取该特定字段的数据，对于我们的订单，我们只需放置一个自定义 HTML 字段并放置一些确认文本以及{dynamic.names}和{dynamic.phone}标签。瞧！这就是它在您的表单中的样子。