Ada banyak plugin di luar sana untuk menampilkan lencana/badge, pemberitahuan, pesan khusus… tetapi seperti biasa, beberapa baris PHP dapat membantu Anda mencapai hasil yang sama!
Hari ini kita melihat cara menambahkan kotak centang ke halaman edit produk, sehingga Anda dapat menampilkan lencana bersyarat berdasarkan apakah kotak centang dicentang atau tidak.
Baca juga Membuat Popular Artikel di Elementor
Masukan Kode Untuk Tampilan Backend
Kode untuk di backend website , masukan pada functions.php :
add_action( ‘woocommerce_single_product_summary’, ‘nw_echo_short_desc_if_empty’, 21 );
function nw_echo_short_desc_if_empty() {
global $post;
if ( empty ( $post->post_excerpt ) ) {
$global_excerpt = ‘<p class=”default-short-desc”>’;
$global_excerpt .= ‘This is the default, global, short description.<br>It will show if <b>no short description has been entered!</b>’;
$global_excerpt .= ‘</p>’;
echo $global_excerpt;
}
}
add_action( ‘woocommerce_product_options_general_product_data’, ‘nw_add_badge_checkbox_to_products’ );
function nw_add_badge_checkbox_to_products() {
woocommerce_wp_checkbox( array(
‘id’ => ‘custom_badge’,
‘class’ => ”,
‘label’ => ‘Show Custom Badge’
)
);
}
Hasil
Kita bisa mengatur sendiri apakah badge akan ditampilkan atau tidak
Masukan kode untuk Tampilan Frontend
Masukan kode berikut di functions.php :
add_action( ‘woocommerce_single_product_summary’, ‘nw_display_badge_if_checkbox’, 6 );
function nw_display_badge_if_checkbox() {
global $product;
if ( get_post_meta( $product->get_id(), ‘custom_badge’, true ) ) {
echo ‘
<div class=”woocommerce-message”>CUSTOM BADGE!</div>
‘;
}
}
Hasil
Custom badge sudah muncul di atas harga. Anda bisa menambahkan warna agar lebih mencolok dengan menggunakan CSS
Masukan kode untuk Tampilan Frontend
Masukan kode berikut di functions.php :
add_action( ‘woocommerce_single_product_summary’, ‘bbloomer_display_badge_if_checkbox’, 6 );
function bbloomer_display_badge_if_checkbox() {
global $product;
if ( get_post_meta( $product->get_id(), ‘custom_badge’, true ) ) {
echo ‘
<div class=”woocommerce-message”>CUSTOM BADGE!</div>
‘;
}
}
Hasil