Woo结帐编辑

在这篇文章中,我们将解释你的X和Pro授权副本附带的Woo Checkout Editor扩展。您将了解它的用途,您可以使用哪些设置,如何添加新的签出字段等等。

  1. 如何启用分机
  2. 概述
  3. 设置
  4. 验证值
  5. 有条件的值
  6. 添加Checkout字段
  7. 管理其他字段
  8. 排序字段
  9. 总结

Woo结帐编辑您可以通过添加和删除字段轻松更改您的WooCommerce结帐页面。

本文假设您已经安装了WooCommerce插件

WordPress插件搜索

如何启用分机

Pro >验证,或X >验证,然后寻找Woo结帐编辑.点击Install。

扩展的概述

一旦安装,安装按钮会改变并说激活.单击该按钮,它将激活插件。然后您将看到状态更改为安装和激活

Woo结帐编辑器激活

概述

Woo Checkout Editor是一个简单易用的WooCommerce扩展,允许您修改,编辑,并从WooCommerce结账过程中删除字段。

有时默认的WooCommerce签出字段并不完全适用于您的业务。您可能需要删除其中一些或添加新的。此外,您可能希望更改字段的顺序。

所有这些结帐页面定制都可以通过WooCommerce使用PHP代码完成行动而且过滤器.如果您对代码很熟悉,那么在不使用插件的情况下进行这些定制就没有问题。然而,如果编码不是你的强项,或者即使是,你不想重新发明轮子,Woo结帐编辑会让你的生活更轻松。

设置

如果你点击结帐管理器WooCommerce你应该看到主签出管理器屏幕,如下所示:

Woo结帐编辑器概述

现在,让我们简要讨论一下每个列的用途。

的名字

方法添加新的签出字段添加签出字段按钮(我们将在后面讨论),则name字段不能更改。名称如billing_first_namebilling_last_namebilling_country,等是WooCommerce预先定义的名称,不能更改。

如果您添加了一个新的签出字段,您可以设置签出字段。该名称作为字段的标识符保存在WordPress数据库中。

标签

这是出现在输入字段上方的文本。

Woo结帐编辑标签

知道你可以把标签如果不希望标签出现在结帐页面上,请输入空白。

占位符

这是出现在输入字段本身内部的文本。假设你想要那个第一个名字输入字段应该有一个文本里面说,“请输入您的名字。”的占位符字段是你放置文本的地方。

Woo结帐编辑器标签占位符

类型

可用的字段类型是:

  • 文本
  • 密码
  • 电话
  • 文本区域
  • 复选框
  • 文件
  • 广播
  • 选择
  • 同时选中

就像在的名字列时,不能更改类型用于预定义的WooCommerce结帐字段。但是当您添加一个新的签出字段时,您可以选择字段类型。

您将注意到所有字段中都有3个公共值。它们是:

  1. form-row-first
  2. form-row-last
  3. form-row-wide

这3个是woocommerce定义的CSS类。请注意和Last Name字段。默认情况下,它们在一起。

Woo结帐编辑标签账单

在结帐编辑器中,第一个名称使用form-row-first类和姓氏所使用的form-row-last

Woo结帐编辑第一个和最后一个名字计费字段

现在,假设你想让First name占用一整行,而Last name占用另一行。为此,我们将两者的类更改为form-row-wide

Woo结帐编辑第一个和最后一个名字计费字段

现在,这是它在结帐页面上的样子:

Woo结帐编辑账单细节

让我们来看最后一个例子。假设你想要城市而且状态字段必须在一行中彼此相邻,因为默认情况下它们各取一行。要做到这一点,我们改变两个的类form-row-wideform-row-first而且form-row-last分别。然后单击保存选项

Woo结帐编辑账单细节城镇和国家

这将是他们在结帐页面上的样子。

Woo结帐编辑计费细节城镇和国家预览

设置

在设置列中,您将看到一个选项链接。当你点击它时,一个模态弹出窗口将出现,其中包含两个选项卡:验证而且条件

Woo结帐编辑标签 Woo结帐编辑器验证设置

验证,可以设置字段应遵循的其他验证规则。下条件,您可以设置规则/条件,何时显示该字段,何时隐藏它。这两种方法将在接下来的章节中讨论。

强制性的

是的使该字段成为必需。它会添加一个签名表示这是必需的。如果一个字段是必需的/强制的,它将在Checkout页面上自动验证。

启用

选择没有从结帐页面和隐藏字段是的显示它。

验证值

默认的WooCommerce字段,如前面讨论的(Billing_first_name, billing_email, billing_state,等等)都有验证规则。例如,如果客户输入无效的电子邮件地址格式到billing_email字段,WooCommerce自动提示错误。

但是,您可能希望为这些默认字段添加额外的验证规则。要做到这一点,单击选项,以及验证你会看到验证设置下拉。下拉菜单中有以下选项:

  • 邮政编码
  • 电话
  • 电子邮件
  • 状态
  • 自定义

如果将值设置为自定义你会看到额外的选项,像这样:

Woo结帐编辑器验证设置自定义

输入您自己的自定义正则表达式。Regex代表正则表达式。您可以了解更多关于如何使用Regex的信息在这里

现在,假设您添加了一个保存客户信息的新字段个人电话号码(举个例子)。您添加该字段(稍后将详细介绍),然后设置验证规则。这一次,你选择电话选项。验证设置下拉。

Woo Checkout编辑器验证设置电话

这是向自定义签出字段添加验证的方法。如果新字段是一个电子邮件、一个州和一个邮政编码,也可以这样做。

有条件的值

您可以根据某些规则/条件显示或隐藏字段。假设您创建了一个附加的字段,其标签为“Our Custom field”只有如果客户的国家是,则显示日本

Woo结帐编辑标签国家

在Woo Checkout Editor屏幕上,单击选项链接国家字段(或任何你想有条件隐藏/显示的字段)来显示弹出窗口。

Woo结帐编辑器标签选项

在弹出窗口中,执行以下操作:

  • 点击有条件的选项卡
  • 选择启用有条件的设置下拉
  • 在“如果当前字段没有此内容字段,请输入日本。
  • 然后隐藏这个字段,选择我们的自定义字段。
Woo Checkout Editor条件设置

# 3和4的意思是,如果我们要使用简单的人类语言,就像这样:“仅当国家字段设置为日本

您还可以选择显示所述字段,这取决于它是否包含产品。假设您想要显示我们的自定义字段仅当产品iPhone X在手推车里。这一次,单击“我们的自定义字段”对面的“选项”链接。然后你必须输入并选择iPhone X旁边的购物车包含下拉。

Woo Checkout Editor条件设置

现在,假设您想要显示我们的自定义字段ifiPhone X是在车里,但不是如果iPhone 8在里面。要做到这一点,请遵循下面的截图:

Woo Checkout Editor条件设置

添加Checkout字段

点击Add Checkout Field,你会看到你的新字段是这样添加的:

Woo结帐编辑结帐字段

您需要输入字段名称、占位符,当然还要选择字段类型。另外,不要忘记启用该字段。缺省值为没有.你需要切换到是的

可用的字段类型是:

  • 文本
  • 密码
  • 电话
  • 文本区域
  • 复选框
  • 文件
  • 广播
  • 选择
  • 同时选中

根据所选的字段类型,您将看到不同的选项。例如,如果你选择其中之一选择同时选中你会看到更多管理选项像这样的链接:

Woo结帐编辑字段

点击管理选项,你会看到一个模式窗口,添加你的选项,如下所示:

Woo结帐编辑器管理选项详细信息

假设您添加了一个Select / Multi-select字段,并且想添加3个选项。选项如下:

  1. 搜索引擎
  2. PPC
  3. 朋友

若要添加这些选项,请使用“|如下图所示:

Woo结帐编辑器管理选项详细信息

管理其他字段

该WooCommerce结帐字段编辑器扩展不仅允许您编辑计费字段,还可以编辑航运字段和额外的字段(如_额外的信息_字段)。

Woo结帐编辑附加信息

排序字段

只需拖放字段到您想要的位置。

Woo结帐编辑字段重新排序

一旦你对一切都感到满意,点击保存选项您的新付款台将准备好!

总结

现在你知道了如何使用你的X或Pro授权副本附带的WooCommerce结帐编辑器扩展自定义你的WooCommerce结帐字段。您已经学习了如何启用扩展,如何添加新字段,如何设置现有字段,添加验证,以及根据某些规则/条件显示或隐藏字段。最后,您还学习了如何更改字段的顺序。

看到不准确的东西了吗?让我们知道

Baidu
map