如何在 Woocommerce 的链接产品中添加更多自定义字段 [英] How to add more custom field in Linked Product of Woocommerce
问题描述
感谢 StackOverflow 的所有开发者.
我想在 Woocommerce 的链接产品部分添加更多字段.这些字段应类似于追加销售/交叉销售.
到目前为止我的代码:-
add_action('woocommerce_product_options_linked_product_data', 'woocom_general_product_data_custom_field');woocommerce_wp_text_input(大批('id' =>'_upsizing_products','标签' =>__( '升级产品', 'woocommerce' ),'占位符' =>'升迁产品','desc_tip' =>'真的'，'说明' =>__( '在此处选择产品', 'woocommerce' )));在上面的代码中我需要组合框，例如当你在输入框中输入3个字符时，它会显示一个可以选择的匹配产品列表.类似于追加销售/交叉销售.
请任何人帮我实现这个自定义字段.提前致谢.
有人吗?
上面的代码中缺少一些东西.
- 您在第一行使用的钩子不存在.右勾叫
woocommerce_product_options_related - 您设计自定义字段的代码不在任何函数中.
- 您正在创建一个标准的文本字段.如果您想要一个选择产品"下拉菜单，您应该使用另一种方法.这应该在您在钩子中使用的那个函数内.
- 您缺少一个钩子和一个函数来实际保存自定义字段中的数据
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:
<块引用>
注意:不要忘记加上[]和名称标签的结尾，否则您的数据将不会被存储.
2.2.显示已选择的产品
接下来是在 WooCommerce 部分及其自身的下拉菜单中显示和突出显示已选择的产品.
为此，将 $product_ids 变量和整行替换为:
$product_ids = get_post_meta( $post->ID, '_upsizing_products_ids', true );相反，产品 ID 是从数据库中的自定义字段中检索的，而不是现有选项之一(例如 cross_sell_ids).
<块引用>注意:_upsizing_products_ids 是数据库中的元键名称.与此键相关的元值包含您的所有字段数据.这用于存储和检索自定义字段.
2.3.在 WooCommerce 部分显示该字段
最后，该函数应该正确挂钩，以便它可以显示在链接产品部分:
add_action('woocommerce_product_options_related', 'woocom_linked_products_data_custom_field');3.保存和存储数据
现在您的自定义字段显示在右侧部分.接下来就是将数据保存到数据库中.
在一个新函数中，使用 $_POST 从字段中检索数据，并使用 update_post_meta 将数据存储在包含 post-ID 的数据库中，唯一的field-id/name (meta-key) 和它自己的数据(meta-value).
函数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 或插件文件中:
//显示链接产品"中的自定义字段；部分add_action('woocommerce_product_options_related', 'woocom_linked_products_data_custom_field');//保存到自定义字段add_action('woocommerce_process_product_meta', 'woocom_linked_products_data_custom_field_save');//生成自定义字段的函数函数 woocom_linked_products_data_custom_field() {全球 $woocommerce, $post;?><p class="form-field"><label for="upsizing_products"><?php _e('Upsizing Product', 'woocommerce');?></label><select class="wc-product-search";多个=多个"样式=宽度:50%；"id="upsizing_products";name="upsizing_products[]";data-placeholder="<?php esc_attr_e('搜索产品…', 'woocommerce');?>>数据操作=woocommerce_json_search_products_and_variations"；data-exclude="ID);?>>><?php$product_ids = get_post_meta( $post->ID, '_upsizing_products_ids', true );foreach ( $product_ids 作为 $product_id ) {$product = wc_get_product( $product_id );如果 ( is_object( $product ) ) {回声'<选项值=".esc_attr( $product_id ) .'''.选择(真，真，假).'>'.wp_kses_post( $product->get_formatted_name() ) .'</选项>';}}?></选择><?php echo wc_help_tip( __( 'Select Products Here.', 'woocommerce' ) );?></p><?php}//函数保存自定义字段函数 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 自定义字段的更多信息.
Thanks to all developers at StackOverflow.
I want to add more fields in Linked Product Section of Woocommerce. The fields should be similar to Upsell/Crosssell.
My code so far:-
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' )
)
);
In the above code i need the combobox, For example when you type 3 characters in input box, it will show a list of matched products which can be selected. Similar to Upsell / Cross Sell.
Please anyone help me implement this custom field. Thanks in Advance.
Edit: Anyone?
There are several things missing in your code above.
- The hook you have used on the first line, do not exist. The right hook is called
woocommerce_product_options_related - The code where you've designed your custom field, is not inside any function.
- You are creating a standard text-field. If you want a "Select Product"-dropdown, you should use another approach. This should be inside that function that you're using in the hook.
- You are missing a hook and a function the actually save the data from your custom field
1. Finding the right hook/action
To find the right hook to use, just search for "woocommerce_product_options_" inside the WoocCommerce plugin, and about 6 PHP-files should appear. One of those files is called "html-product-data-linked-products.php". This file contains all the existing options in that specific WooCommerce section. It also contains the hook used to display those options.
Open the file and check it out. The hook is at the bottom of the page
Full Path: /wp-content/plugins/woocommerce/includes/admin/metaboxes/views/
2. Creating the dropdown
To create a select-dropdown including a product search, you need a much different code than the one above.
The spare some time, you can just copy-paste one of the existing options, in the file mentioned above, and then modify it, to your needs.
All this should be placed inside a function called: woocom_linked_products_data_custom_field().
2.1. Modify the ID/name
The first things you need to modify in the code, is of course the unique ID/name of the field.
This is placed in the label-tag (for) and the select-tag (id and name).
In your example the ID/name should be upsizing_products and the label-text 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…', '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. Show already chosen products
The next thing, is to show and highligt already chosen products in the WooCommerce section and the dropdown it self.
To do this replace the $product_ids-variable and the entire line with:
$product_ids = get_post_meta( $post->ID, '_upsizing_products_ids', true );
With this instead, the product id's is retrieved from your custom field in the database instead of one of the existing options (cross_sell_ids for example).
Note: The
_upsizing_products_idsis 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. Display the field in the WooCommerce section
Lastly, the function should be properly hooked, so it can be displayed in the Linked Products section:
add_action( 'woocommerce_product_options_related', 'woocom_linked_products_data_custom_field' );
3. Save and store the data
Now your custom field is displayed inside the right section. The next thing is to save and store the data in the database.
Inside a new function, use $_POST to retrieve the data from the field, and update_post_meta to store the data in the database containing the post-ID, the unique field-id/name (meta-key) and the data it self (meta-value).
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' );
Here's the full code. Put it inside your themes functions.php or a plugin file:
// 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…', '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 );
}
To display the stored data use _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.
这篇关于如何在 Woocommerce 的链接产品中添加更多自定义字段的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
