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

Question

感谢StackOverflow的所有开发人员.

我想在Woocommerce的Linked Product部分添加更多字段.这些字段应与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个字符时,它将显示可以选择的匹配产品列表.与Upsell/Cross Sell类似.

请任何人帮我实现此自定义字段.提前致谢.

编辑:有人吗？

Answer 1

上面的代码中缺少一些内容.

1. 你在第一行使用的钩子不存在.调用右钩子woocommerce_product_options_related
2. 您设计自定义字段的代码不在任何函数内.
3. 您正在创建标准文本字段.如果您想要"选择产品" - 下拉列表,则应使用其他方法.这应该在你在钩子中使用的函数内部.
4. 您缺少一个钩子和一个函数,实际上是保存自定义字段中的数据

1.找到合适的钩子/动作

要找到合适的钩子,只需在WoocCommerce插件中搜索"woocommerce_product_options_",就会出现大约6个PHP文件.其中一个文件称为"html-product-data-linked-products.php".此文件包含该特定WooCommerce部分中的所有现有选项.它还包含用于显示这些选项的钩子.

打开文件并检查出来.钩子位于页面的底部

完整路径: /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 ); ?>">

注意:不要忘记放置[]名称标签的末尾,否则您的数据将不会被存储.

2.2.显示已选择的产品

接下来,就是在WooCommerce部分中展示和选择已经选择的产品以及它自己的下拉列表.

为此,请使用以下内容替换$product_ids-variable和整行:

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

相反,使用数据库中的自定义字段而不是现有选项之一(例如cross_sell_ids)检索产品ID .

注意:这_upsizing_products_ids是数据库中的元键名称.与此键相关的元值包含所有字段数据.这用于存储和检索自定义字段.

2.3.在WooCommerce部分中显示该字段

最后,该函数应该正确挂钩,因此它可以显示在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 );

查看本指南掌握WooCommerce产品自定义字段,了解有关WooCommerce自定义字段的更多信息.