首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >如何在Woocommerce的链接产品中添加更多自定义字段

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

Stack Overflow用户
提问于 2017-07-19 19:37:47
回答 1查看 4.2K关注 0票数 9

感谢StackOverflow的所有开发人员。

我想在Woocommerce的链接产品部分添加更多的字段。字段应该类似于向上/交叉销售。

到目前为止我的密码是:-

代码语言:javascript
复制
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' ) 
    )
  );

在上面的代码中,我需要combobox,例如,当您在输入框中键入3个字符时,它将显示一个可以选择的匹配产品列表。类似于向上销售/交叉销售。

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

编辑:有人吗?

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2017-08-10 18:13:59

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

  1. 您在第一行中使用的钩子不存在。右边的钩子叫做woocommerce_product_options_related
  2. 您设计自定义字段的代码不在任何函数中。
  3. 您正在创建一个标准文本字段。如果您想要一个“选择产品”-dropdown,您应该使用另一种方法。这应该在你在钩子中使用的函数中。
  4. 您缺少一个钩子和一个函数,即从自定义字段中实际保存数据。

1.找到正确的钩子/行动

要找到正确的钩子使用,只需搜索"woocommerce_product_options_“内的WoocCommerce插件,大约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 -tag和select-tag (__idname__)中。

在您的示例中,ID/名称应该是upsizing_products,标签文本Upsizing Products

代码语言:javascript
复制
<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和整个行替换为:

代码语言:javascript
复制
$product_ids = get_post_meta( $post->ID, '_upsizing_products_ids', true );

这样,可以从数据库中的自定义字段中检索产品id,而不是现有选项之一(例如cross_sell_ids)。

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

2.3.在WooCommerce节中显示该字段

最后,函数应该正确挂钩,因此可以在链接产品部分中显示:

代码语言:javascript
复制
add_action( 'woocommerce_product_options_related', 'woocom_linked_products_data_custom_field' );

3.数据的保存和存储

现在,您的自定义字段显示在正确的部分中。下一步是在数据库中保存和存储数据。

在一个新函数中,使用$_POST从字段检索数据,使用update_post_meta将数据存储在包含后缀id、唯一字段id/name(元键)及其自身数据(元值)的数据库中。

代码语言:javascript
复制
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或插件文件中:

代码语言:javascript
复制
// 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

代码语言:javascript
复制
echo get_post_meta( $post->ID, 'my-field-slug', true );

有关WooCommerce自定义字段的更多信息,请参阅本指南WooCommerce。

票数 17
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/45199599

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档