如何以编程方式创建自定义 WooCommerce 产品类型

已发表: 2023-01-03

在构建复杂的 WooCommerce 商店时，您可能需要针对特定​​问题创建自己的解决方案。 这些问题之一是缺少特定的 WooCommerce 产品类型。 这就是为什么我们在 QuadLayers 为您带来了关于如何为您的网站创建自定义 WooCommerce 产品类型的指南。

我们将研究如何定义您的产品类型、为它们启用特定选项和价格等等。 但首先，让我们看看 WooCommerce 产品类型以及自定义产品类型可以做什么。

为什么要在 WooCommerce 中添加自定义产品类型？

默认情况下，WooCommerce 有四种独特的产品类型。 这些都是：

  • 简单的产品
  • 可变产品
  • 外部/关联
  • 可下载产品

当然，使用外部 WooCommerce 插件，您可以添加更多产品类型，如订阅产品、可预订产品、会员资格等。

但是，如果您想创建这些特定类型以外的产品类型怎么办？ 如果您有默认 WooCommerce 产品类型无法满足的特殊要求，或者如果您想在不使用第三方插件的情况下创建自定义产品类型（例如会员资格或拍卖产品），那么您可以使用一些创建自定义产品类型编码。

使用自定义产品类型意味着向产品类型添加不同的、唯一的设置。 例如，如果您想要特定的可变产品类型并为其添加不同的可见性或定价设置，那么您可以使用自定义产品类型来实现。 此外，您还可以为一种独特的产品定义特定的产品类型，并且仅在您愿意时才更改产品类型设置。

无论您的需求如何，拥有自定义产品类型都可以让您在自定义和定义您在网站上销售的产品时更加灵活。

如何创建自定义 WooCommerce 产品类型？

创建 WooCommerce 产品类型的过程非常简单，但确实需要一定程度的编码。 如果您想继续阅读本文，我们建议我们的客户了解更多有关创建自定义 WordPress 插件和向其添加代码的信息。

一旦您了解了在您的网站目录中创建WordPress 插件的基础知识，请继续并打开您的WP 安装目录，打开wp-content/plugins并创建文件夹“ QuadLayers_custom-product-type ”。 对于我们的演示，我们将使用我们的本地主机目录。

为自定义 WooCommerce 产品类型创建文件夹

之后，创建一个名为“ Quadlayers_custom-product-type.php ”的文件。 这是您的主文件，它作为插件其他功能的入口。

打开此文件并将以下代码行粘贴到文件中：

 <?php

/**
* 插件名称：Quadlayers 自定义产品类型
* 说明：Quadlayers 创建自定义 WooCommerce 产品类型指南的代码
*/

如果（！定义（'ABSPATH'））{
返回;
}

在插件的主文件中添加代码

这组代码通过添加插件名称和描述来定义您的插件。 现在，这就足够了，因为我们需要向该文件添加更多代码才能使其正常运行。 现在，您需要激活新创建的插件。 我们将在本教程中保持插件激活状态，并在进行过程中添加更多代码。

因此，继续并打开您的WP Admin Dashboard并单击Plugins 。 在这里，您应该会看到一个名为 Quadlayers Custom Product Type 的新插件。 继续并激活它并转到教程的下一步。

激活自定义 woocommerce 产品类型插件

注册自定义 WooCommerce 产品类型

接下来，我们将创建一个函数来定义我们的自定义产品类型并将其注册为 WooCommerce 产品类型。 为此，将此代码添加到插件的主文件中：

 add_action( 'init', 'register_demo_product_type' );
函数 register_demo_product_type() {
类 WC_Product_Demo 扩展 WC_Product {

公共函数 __construct( $product ) {
$this->product_type = '演示';
父母::__构造（$产品）；
}
}
}

这将注册一个名为demo 的自定义产品类型。 如果要更改产品类型的名称，只需更改$this->product_type = 'demo';中的文本即可。

添加自定义 WooCommerce 产品选项。

在此之后，我们需要将自定义产品类型添加到产品类型下拉列表中。 当您在WP 管理仪表板上创建或编辑产品时，这使您可以选择产品类型。 将此代码添加到插件的主文件中，您应该会在产品类型列表中看到一个新选项。

 add_filter( 'product_type_selector', 'add_demo_product_type' );
函数 add_demo_product_type( $types ){
$types[ 'demo' ] = __( '演示产品', 'dm_product' );
返回$类型； 
}

此代码将使用$types['demo'] = __('Custom Product Type')行将您的自定义产品类型添加到产品数据下拉列表中。 您可以将文本从自定义产品类型更改为任何内容，例如演示产品、自定义订单、礼品卡等。

现在，打开您的WP 管理仪表板并创建一个新产品。 在“产品类型”下拉菜单下，您应该会看到一个名为“ Demo Product ”的新选项。

在创建新产品时选择自定义产品类型

添加自定义产品类型选项卡

以下函数将为您的自定义产品类型构建一个新的设置选项卡。 通过这种方式，您可以向您的产品类型添加不与其他产品类型共享的特定详细信息。

粘贴此函数以构建一个选项卡自定义产品详细信息：

 add_filter( 'woocommerce_product_data_tabs', 'demo_product_tab' );
函数 demo_product_tab($tabs){

$tabs['演示'] = 数组(
'label' => __( 'Demo Product', 'dm_product' ),
'target' => 'demo_product_options',
'class' => 'show_if_demo_product',
);
返回 $ 标签；
}
}

如果您在上面定义了自己的 product_type，请记住在$tabs['demo'] = array中使用您的product_type ID而不是 'demo'。

我们使用的数组中的三个参数是：

标签：这定义了您的自定义产品选项卡的名称。
target：这设置了一个标识符，我们将使用它来向选项卡添加设置。
类：这使您可以检查何时显示自定义产品选项卡。

在这里，在类参数中，我们使用了 show_if_Demo_product，这意味着此选项卡仅在选择您的自定义产品类型时显示。

自定义产品类型的特定选项卡

添加自定义产品类型选项卡字段

接下来，让我们向选项卡添加一些设置和字段，以便您可以为您的自定义产品类型设置价格和各种选项。 为此，将此代码添加到插件的主文件中：

 add_action( 'woocommerce_product_data_panels', 'QL_custom_product_options_product_tab_content' );

函数 QL_custom_product_options_product_tab_content() {
// 不要忘记将 div 中的 id 更改为产品选项卡的目标
?><div class='panel woocommerce_options_panel'><?php
?><div class='options_group'><?php

woocommerce_wp_checkbox(数组(
'id' => '_enable_custom_product',
'label' => __( '启用自定义产品类型'),
));

woocommerce_wp_text_input(
大批（
'id' => 'demo_product_info',
'label' => __( 'Custom Product details', 'dm_product' ),
'占位符' => '',
'desc_tip' => '真',
'description' => __( '输入演示产品详细信息。', 'dm_product' ),
'类型'=>'文本'
)
);


?></div>
</div><?php
}

这将添加一个复选框选项以启用自定义产品类型和产品的自定义文本字段。 当然，您可以使用其他 WooCommerce 函数添加更多设置，例如用于下拉列表的 woocommerce_wp_select()、用于文本区域的 woocommerce_wp_textarea_input() 等等。

但对于我们的演示，我们只会显示有关自定义产品管理员可以从后端自定义的简单文本信息。

自定义产品水龙头类型的特定选项

您可以在此处了解有关这些功能以及如何使用它们的更多信息。

保存自定义 WooCommerce 产品类型选项卡字段

现在我们已经创建了产品类型设置，我们必须将它们保存到我们的数据库中。 这是使用 woocommerce_process_product_meta 挂钩完成的。 为此，我们将使用这些代码行：

 add_action( 'woocommerce_process_product_meta', 'save_demo_product_settings' );

函数 save_demo_product_settings( $post_id ){

$demo_product_info = $_POST['demo_product_info'];

如果（！空（$demo_product_info））{
update_post_meta( $post_id, 'demo_product_info', esc_attr( $demo_product_info ) );
}
}

将此代码添加到插件的主文件后，您将能够在更新或发布产品时保存自定义产品类型设置。

为自定义产品选项卡类型保存的产品设置

但是，这些代码仅适用于后端，现在将显示在您产品的前端，直到我们定义一个模板供 WooCommerce 使用。 为此，我们将使用教程的下一步来显示自定义产品类型的内容。

为自定义产品类型添加内容

您刚刚为您的网站创建了自定义产品类型，但您还需要向 WooCommerce 指定您希望该产品类型具有的内容类型。 为此，我们将使用 woocommerce_single_product_summary 挂钩来添加我们添加到“自定义产品详细信息”选项卡的产品信息。

 add_action( 'woocommerce_single_product_summary', 'demo_product_front' );

函数 demo_product_front () {
全球$产品；
如果（'演示'== $product->get_type()）{ 
echo( get_post_meta( $product->get_id(), 'demo_product_info' )[0] );
}
}

确保您的产品类型 ID 与代码匹配if ('demo' == $product->get_type() ，如上所述。保存此代码后，您将在正面看到您的自定义产品详细信息。

完整的代码片段

为了您的方便，我们将不同的代码组合成一个集合，因此您只需将其粘贴到插件的主文件中并根据需要进行编辑。

 <?php
/**
* 插件名称：QuadLayers 自定义产品类型
* 描述：用于向 WooCommerce 添加自定义产品类型的插件
* 作者：四层
* 作者 URI：https://www.quadlayers.com
*版本：1.0
*/


定义（'ABSPATH'）或退出；

add_action( 'init', 'register_demo_product_type' );
函数 register_demo_product_type() {
类 WC_Product_Demo 扩展 WC_Product {

公共函数 __construct( $product ) {
$this->product_type = '演示';
父母::__构造（$产品）；
}
}
}


add_filter( 'product_type_selector', 'add_demo_product_type' );
函数 add_demo_product_type( $types ){
$types[ 'demo' ] = __( '演示产品', 'dm_product' );
返回$类型； 
}


add_filter( 'woocommerce_product_data_tabs', 'demo_product_tab' );
函数 demo_product_tab($tabs){

$tabs['演示'] = 数组(
'label' => __( 'Demo Product', 'dm_product' ),
'target' => 'demo_product_options',
'class' => 'show_if_demo_product',
);
返回 $ 标签；
}


add_action( 'woocommerce_product_data_panels', 'demo_product_tab_product_tab_content' );
函数 demo_product_tab_product_tab_content() {
?><div class='panel woocommerce_options_panel'><?php
?><div class='options_group'><?php


woocommerce_wp_checkbox(数组(
'id' => '_enable_custom_product',
'label' => __( '启用自定义产品类型'),
));


woocommerce_wp_text_input(
大批（
'id' => 'demo_product_info',
'label' => __( '演示产品详细信息', 'dm_product' ),
'placeholder' => '在此处插入要在前端显示的文本',
'desc_tip' => '真',
'description' => __( '输入演示产品信息', 'dm_product' ),
'类型'=>'文本'
)
);
?></div>
</div><?php
}

add_action( 'woocommerce_process_product_meta', 'save_demo_product_settings' );

函数 save_demo_product_settings( $post_id ){

$enable_custom_product = isset( $_POST['_enable_custom_product'] ) ? '是' : '否';
update_post_meta( $post_id, '_enable_custom_product', $enable_custom_product );
$demo_product_info = $_POST['demo_product_info'];

如果（！空（$demo_product_info））{
update_post_meta( $post_id, 'demo_product_info', esc_attr( $demo_product_info ) );
}
}


add_action( 'woocommerce_single_product_summary', 'demo_product_front' );

函数 demo_product_front () {
全球$产品；
如果（'演示'== $product->get_type()）{ 
echo( get_post_meta( $product->get_id(), 'demo_product_info' )[0] );
}
}

当然，我们在本教程中展示的所有步骤都非常简单，您可以而且应该尝试向您的自定义产品类型添加更多字段、设置和内容。 此外，如您所见，本教程的编程工作量有点大。 因此，如果您不熟悉 WordPress 或编码，您可以随时在评论部分寻求我们的帮助。 此外，您还可以做一些完全不同的事情，使用主题的 functions.php 文件将所有这些代码添加到您的网站。

这将跳过创建 WordPress 插件的步骤，但请注意，如果您更改或更新主题（除非您使用子主题），您的更改将会消失。我们强烈建议使用此方法的插件，但如果您愿意要使用 functions.php 文件，您可以这样做。

永远记得在更改 functions.php 文件之前对您的 WordPress 网站进行完整备份。 这样，万一出现任何问题，您可以随时恢复到工作版本。

只需单击外观 > 主题文件编辑器，然后单击主题文件右侧栏中的主题函数或 functions.php。

打开主题文件编辑器以使用功能文件

然后，您只需将上述代码粘贴到编辑器中，然后单击“更新文件”即可完成。

将代码添加到主题功能文件

结论

这结束了以编程方式创建自定义 WooCommerce 产品类型所需的所有步骤。 让我们快速总结一下创建自定义产品类型所需的所有步骤：

  • 为您的自定义 WooCommerce 产品类型创建并激活插件。
  • 注册您的新产品类型。
  • 为单个产品页面的自定义产品类型添加一个选项卡。
  • 将字段和设置添加到您的产品选项卡。
  • 保存产品选项卡上的字段和设置。
  • 在前端显示您的产品标签内容。

最后，为了您的方便，我们将所有不同的代码片段组合在一起，为您提供完整的代码。 因此，您可以将整个代码复制到您的主文件中，并根据需要进行更改。

我们希望您觉得这篇文章对您有所帮助。 如果您想了解有关设置各种 WooCommerce 设置和产品选项的更多信息，为什么不查看我们的其他一些文章：

  • 如何设置 WooCommerce 批量折扣
  • 如何以编程方式创建 WordPress 用户
  • 以编程方式创建 WordPress 自定义字段