[WordPress] Thêm field vào Product Meta (Dữ Liệu Sản Phẩm)

Hướng dẫn thêm field vào trong Product Meta hay còn gọi là Dữ liệu sản phẩm trong WooCommerce WordPress mà không dùng plugin

Thêm vào field vào General Tab 

Ở trong WooCommerce chúng ta có 3 loại hooks:

• Nhóm tùy chọn giá : woocommerce_product_options_pricing
• Nhóm cài đặt sản phẩm có thể tải xuống – woocommerce_product_options_downloads
• Nhóm cài đặt thuế – woocommerce_product_options_tax.

Nếu bạn muốn tạo nhóm tùy chọn của riêng mình bên dưới, hãy sử dụng hook woocommerce_product_options_general_product_data, ví dụ:

add_action( 'woocommerce_product_options_general_product_data', 'devpd_option_group' );

function devpd_option_group() {
    echo '<div class="options_group">
            <p class="form-field _product_url_aff_field ">
                <label for="_product_url_aff_field">URL Affiliate</label>
                <input type="text" class="short" style="" name="_product_url_aff_field" id="_product_url_aff_field" value="'.get_post_meta( get_the_ID(), '_product_url_aff_field', true ).'" placeholder="https://">
                 <span class="description">Nhập URL Affiliate cho sản phẩm.</span>
            </p>
        </div>';
}

kết quả

Image

Lưu data từ custom field mới tạo

Để lưu data chúng ta dùng dùng hook woocommerce_process_product_meta

add_action( 'woocommerce_process_product_meta', 'devpd_save_field' );

function devpd_save_field( $post_id ){
	$product_url_aff_field = $_POST[ '_product_url_aff_field' ] ;
    if( ! ( isset( $product_url_aff_field ) || wp_verify_nonce( sanitize_key( $product_url_aff_field ), 'woocommerce_save_data' ) ) ) {
        return false;
    }
    update_post_meta( $post_id, '_product_url_aff_field', sanitize_text_field( $product_url_aff_field ) );

}

Như vậy dữ liệu sẽ được lưu vào trong meta của product thông qua update_post_meta, tương tự chúng ta có thể làm với các tab khác :

1. Thêm vào field vào Inventory Tab

Các hooks trong Inventory:

• Nhóm cài đặt trạng thái tồn kho woocommerce_product_options_stock_status
• Nhóm bán riêng lẻ:  woocommerce_product_options_sold_individually

Hoặc thêm nhóm tùy chỉnh của bạn bằng hook woocommerce_product_options_inventory_product_data tương tự như trên.

2. Thêm vào field vào Shipping Tab

Các hook trong shipping tab:

• Nhóm đầu tiên kích thước sản phẩm – woocommerce_product_options_dimensions
• Nhóm thứ hai – woocommerce_product_options_shipping

Ở tab này không có hook custom, bạn chỉ có dùng hook: woocommerce_product_options_shipping_product_data

3. Thêm vào field vào Linked products tab 

Chúng ta phải sử dụng hook woocommerce_product_options_related

4. Thêm vào field vào Advanced products tab 

Chúng ta sử dụng hook: woocommerce_product_options_reviews và woocommerce_product_options_advanced

Snippet Code thêm Field vào Advanced Tab

Dưới đây là snippet code thêm input checkbox vào trong Advanced Tab (Tab Nâng cao)

function devpd_product_field(){

	echo '<div class="options_group">';
	woocommerce_wp_checkbox(
		array(
			'id'      => 'spr',
			'value'   => get_post_meta( get_the_ID(), 'super_product', true ),
			'label'   => 'This is a super product',
			'desc_tip' => true,
			'description' => 'If it is not a regular WooCommerce product',
		)
	);
	echo '</div>';

}

add_action( 'woocommerce_process_product_meta', 'devpd_save_field' );
function devpd_save_field( $id ){

	$super = isset( $_POST[ 'spr' ] ) && 'yes' === $_POST[ 'spr' ] ? 'yes' : 'no';
	update_post_meta( $id, 'super_product', $super );

}

Kết quả

Image

Ở đây chúng ta có dùng woocommerce_wp_checkbox để tạo input checkbox là một function có sẵn của WooCommerce, ngoài ra bạn có các function khác như:

• woocommerce_wp_text_input : tạo input
• woocommerce_wp_textarea_input: tạo textarea
• woocommerce_wp_select: tạo select