php - 如何在 Woocommerce 的链接产品中添加更多自定义字段

Question

感谢 StackOverflow 的所有开发人员。

我想在 Woocommerce 的链接产品部分添加更多字段。这些字段应该类似于 Upsell/Crosssell。

到目前为止我的代码:-

add_action( 'woocommerce_product_options_linked_product_data', 'woocom_general_product_data_custom_field' );

 woocommerce_wp_text_input( 
    array( 
      'id' => '_upsizing_products', 
      'label' => __( 'Upsizing Products', 'woocommerce' ), 
      'placeholder' => 'Upsizing Products',
      'desc_tip' => 'true',
      'description' => __( 'Select Products Here', 'woocommerce' ) 
    )
  );

在上面的代码中我需要组合框，例如当你在输入框中输入 3 个字符时，它会显示一个可以选择的匹配产品列表。类似于追加销售/交叉销售。

请任何人帮我实现这个自定义字段。提前致谢。

编辑:有人吗？

Answer 1

上面的代码中缺少一些东西。

1. 您在第一行使用的钩子(Hook)不存在。右钩称为 woocommerce_product_options_related
2. 您设计自定义字段的代码不在任何函数内。
3. 您正在创建一个标准的文本字段。如果您想要“选择产品”下拉菜单，则应使用另一种方法。 这应该在您在 Hook 中使用的那个函数内。
4. 你缺少一个钩子(Hook)和一个函数来实际保存自定义字段中的数据

---

1。找到正确的钩子(Hook)/ Action

要找到要使用的正确 Hook ，只需在 WoocCommerce 插件中搜索 “woocommerce_product_options_”，应该会出现大约 6 个 PHP 文件。其中一个文件名为 “html-product-data-linked-products.php”。此文件包含该特定 WooCommerce 部分中的所有现有选项。它还包含用于显示这些选项的 Hook 。

打开文件并检查它。 Hook 在页面底部

Full Path: /wp-content/plugins/woocommerce/includes/admin/metaboxes/views/

---

2。创建下拉列表

要创建包含产品搜索的选择下拉菜单，您需要与上述代码大不相同的代码。

空闲一些时间，您可以复制粘贴上述文件中的现有选项之一，然后根据您的需要进行修改。

所有这些都应该放在一个名为:woocom_linked_products_data_custom_field() 的函数中。

2.1。修改ID/姓名

您需要在代码中修改的第一件事，当然是字段的唯一 ID/名称。 这被放置在 label-tag (for) 和 select-tag (id 和 name)。

在您的示例中，ID/名称应为 upsizing_products 和标签文本 Upsizing Products:

<label for="upsizing_products"><?php _e( 'Upsizing Product', 'woocommerce' ); ?></label>
<select class="wc-product-search" multiple="multiple" style="width: 50%;" id="upsizing_products" name="upsizing_products[]" data-placeholder="<?php esc_attr_e( 'Search for a product&hellip;', 'woocommerce' ); ?>" data-action="woocommerce_json_search_products_and_variations" data-exclude="<?php echo intval( $post->ID ); ?>">

Note: Don't forget to put an [] and the end of the name-tag, or your data will not be stored.

2.2。显示已选择的产品

接下来，是在 WooCommerce 部分及其自身的下拉列表中显示并突出显示已选择的产品。

为此，将 $product_ids 变量和整行替换为:

$product_ids = get_post_meta( $post->ID, '_upsizing_products_ids', true );

取而代之的是，产品 ID 是从数据库中的自定义字段而不是现有选项之一(例如 cross_sell_ids) 中检索的。

Note: The _upsizing_products_ids is the meta-key name in the database. The meta-value related to this key, contains all your field data. This is used to store and retrieve the custom field.

2.3。在 WooCommerce 部分显示字段

最后，该函数应该正确 Hook ，以便它可以显示在Linked Products部分:

add_action( 'woocommerce_product_options_related', 'woocom_linked_products_data_custom_field' );

---

3。保存和存储数据

现在您的自定义字段显示在右侧部分中。接下来就是将数据保存并存储在数据库中。

在一个新函数中，使用$_POST 从字段中检索数据，并使用update_post_meta 将数据存储在包含post-ID 的数据库中，这是唯一的字段 ID/名称​​(元键) 及其自身的数据(元值)。

function woocom_linked_products_data_custom_field_save( $post_id ){
    $product_field_type =  $_POST['upsizing_products'];
    update_post_meta( $post_id, '_upsizing_products_ids', $product_field_type );
}
add_action( 'woocommerce_process_product_meta', 'woocom_linked_products_data_custom_field_save' );

---

这是完整的代码。将其放入您的主题 functions.php 或插件文件中:

// Display the custom fields in the "Linked Products" section
add_action( 'woocommerce_product_options_related', 'woocom_linked_products_data_custom_field' );

// Save to custom fields
add_action( 'woocommerce_process_product_meta', 'woocom_linked_products_data_custom_field_save' );


// Function to generate the custom fields
function woocom_linked_products_data_custom_field() {
    global $woocommerce, $post;
?>
<p class="form-field">
    <label for="upsizing_products"><?php _e( 'Upsizing Product', 'woocommerce' ); ?></label>
    <select class="wc-product-search" multiple="multiple" style="width: 50%;" id="upsizing_products" name="upsizing_products[]" data-placeholder="<?php esc_attr_e( 'Search for a product&hellip;', 'woocommerce' ); ?>" data-action="woocommerce_json_search_products_and_variations" data-exclude="<?php echo intval( $post->ID ); ?>">
        <?php
            $product_ids = get_post_meta( $post->ID, '_upsizing_products_ids', true );

            foreach ( $product_ids as $product_id ) {
                $product = wc_get_product( $product_id );
                if ( is_object( $product ) ) {
                    echo '<option value="' . esc_attr( $product_id ) . '"' . selected( true, true, false ) . '>' . wp_kses_post( $product->get_formatted_name() ) . '</option>';
                }
            }
        ?>
    </select> <?php echo wc_help_tip( __( 'Select Products Here.', 'woocommerce' ) ); ?>
</p>

<?php
}

// Function the save the custom fields
function woocom_linked_products_data_custom_field_save( $post_id ){
    $product_field_type =  $_POST['upsizing_products'];
    update_post_meta( $post_id, '_upsizing_products_ids', $product_field_type );
}

要显示存储的数据，请使用 _upsizing_products_ids:

echo get_post_meta( $post->ID, 'my-field-slug', true );

Check out this guide Mastering WooCommerce Products Custom Fields for more information about Custom Fields for WooCommerce.