Bạn có nhiều website và nhiều mặt hàng khác nhau. Ví dụ web bán quần áo thì giá sẽ tính theo bộ. Còn web bán mật ong thì giá lại tính theo hộp, lọ và web bán bất động sản thì giá sẽ tính theo nền chẳng hạn 🙂 Vì thế hôm nay chúng ta sẽ thêm ghi chú đó vào giá để khách hàng dễ nhận biết.
Trong bài này chúng ta sẽ thêm nội dung bất kỳ vào trước và sau giá của sản phẩm trong Woocommerce. Trong tiếng anh gọi là Prefix và Suffix.
Bước 1: Copy đoạn mã bên dưới và paste vào dưới cùng của file functions.php (Giao diện -> Sửa giao diện -> functions.php)
add_filter(‘woocommerce_currency_symbol’, ‘change_existing_currency_symbol’, 10, 2);
function change_existing_currency_symbol( $currency_symbol, $currency ) {
switch( $currency ) {
case ‘VND’: $currency_symbol = ‘Tỷ’; break;
}
return $currency_symbol;
}
function devvn_woocommerce_general_settings( $array ) {
$array[] = array( ‘name’ => __( ‘Prefix and suffix to price’, ‘woocommerce’ ), ‘type’ => ‘title’, ‘desc’ => ”, ‘id’ => ‘woocommerce_presuffix_settings’ );
$array[] = array(
‘title’ => __( ‘Prefix’, ‘woocommerce’ ),
‘desc’ => __( ‘Add prefix to price. Leave blank to disable.’, ‘woocommerce’ ),
‘id’ => ‘devvn_woocommerce_price_prefix’,
‘desc_tip’ => true,
‘type’ => ‘text’,
);
$array[] = array(
‘title’ => __( ‘Suffix’, ‘woocommerce’ ),
‘desc’ => __( ‘Add suffix to price. Leave blank to disable.’, ‘woocommerce’ ),
‘id’ => ‘devvn_woocommerce_price_suffix’,
‘desc_tip’ => true,
‘type’ => ‘text’,
);
$array[] = array( ‘type’ => ‘sectionend’, ‘id’ => ‘woocommerce_presuffix_settings’);
return $array;
};
add_filter( ‘woocommerce_general_settings’, ‘devvn_woocommerce_general_settings’, 10, 1 );
/*Add metabox to product*/
add_action( ‘woocommerce_product_options_general_product_data’, ‘devvn_presuffix_products’ );
function devvn_presuffix_products() {
//Add metabox prefix to product
woocommerce_wp_text_input( array(
‘id’ => ‘_product_prefix’,
‘label’ => ‘Prefix’,
‘description’ => ‘Add prefix to price. Leave blank to default.’,
‘desc_tip’ => ‘true’,
) );
//Add metabox suffix to product
woocommerce_wp_text_input( array(
‘id’ => ‘_product_suffix’,
‘label’ => ‘Suffix’,
‘description’ => ‘Add suffix to price. Leave blank to default.’,
‘desc_tip’ => ‘true’,
) );
}
/*Save metabox prefix and suffix*/
add_action( ‘woocommerce_process_product_meta’, ‘devvn_presuffix_products_save’ );
function devvn_presuffix_products_save( $post_id ) {
if(get_post_type($post_id) == ‘product’){
if ( isset($_POST[‘_product_prefix’]) ) {
if ($_POST[‘_product_prefix’] != “”) {
update_post_meta($post_id, ‘_product_prefix’, sanitize_text_field($_POST[‘_product_prefix’]));
} else {
delete_post_meta($post_id, ‘_product_prefix’);
}
}
if ( isset($_POST[‘_product_suffix’]) ) {
if ($_POST[‘_product_suffix’] != “”) {
update_post_meta($post_id, ‘_product_suffix’, sanitize_text_field($_POST[‘_product_suffix’]));
} else {
delete_post_meta($post_id, ‘_product_suffix’);
}
}
}
}
/*Add to price html*/
add_filter( ‘woocommerce_get_price_html’, ‘bbloomer_price_prefix_suffix’, 100, 2 );
function bbloomer_price_prefix_suffix( $price, $product ){
$prefix = get_option( ‘devvn_woocommerce_price_prefix’);
$suffix = get_option( ‘devvn_woocommerce_price_suffix’);
$prefix_product = sanitize_text_field(get_post_meta($product->get_ID(), ‘_product_prefix’, true));
$suffix_product = sanitize_text_field(get_post_meta($product->get_ID(), ‘_product_suffix’, true));
if($prefix_product || (is_numeric($prefix_product) && $prefix_product == 0)) $prefix = $prefix_product;
if($suffix_product || (is_numeric($suffix_product) && $suffix_product == 0)) $suffix = $suffix_product;
$prefix = ($prefix && $prefix !== 0)?'<span class=”devvn_woocommerce_price_prefix”>’.$prefix.'</span>’:”;
$suffix = ($suffix && $suffix !== 0)?'<span class=”devvn_woocommerce_price_suffix”>’.$suffix.'</span>’:”;
$price = $prefix.$price.$suffix;
return apply_filters( ‘devvn_woocommerce_get_price’, $price );
}
remove_action( ‘woocommerce_after_shop_loop_item’, ‘woocommerce_template_loop_add_to_cart’);
remove_action( ‘woocommerce_single_product_summary’, ‘woocommerce_template_single_add_to_cart’, 30 );
/*giá 0 đồng thành liên hệ */
function devvn_wc_custom_get_price_html( $price, $product ) {
if ( $product->get_price() == 0 ) {
if ( $product->is_on_sale() && $product->get_regular_price() ) {
$regular_price = wc_get_price_to_display( $product, array( ‘qty’ => 1, ‘price’ => $product->get_regular_price() ) );
$price = wc_format_price_range( $regular_price, __( ‘Free!’, ‘woocommerce’ ) );
} else {
$price = ‘<span class=”amount”>’ . __( ‘Liên hệ’, ‘woocommerce’ ) . ‘</span>’;
}
}
return $price;
}
add_filter( ‘woocommerce_get_price_html’, ‘devvn_wc_custom_get_price_html’, 10, 2 );
… Và đừng quên bấm Cập nhật tập tin nhé!
Bước 2: Tùy chỉnh trong WooCommerce
Và đây là kết quả hiển thị ngoài website
Vậy là đã xong rồi đấy, bạn đã có thể hiển thị thêm nội dung vào trước và sau giá sản phẩm. Ngoài ra có chút Css để cho đẹp hơn, cái này tùy vào từng theme và từng thẩm mỹ mỗi người mà style nhé! Chúc các bạn thành công!
