Thêm nút liên hệ đặt hàng khi sản phẩm hết hàng trong Woocommerce

Khi một sản phẩm hết hàng thì nó sẽ hiện dòng text “Hết hàng”. Nhưng nếu bạn muốn thêm nút Liên hệ đặt hàng khi sản phẩm hết hàng thì cứ tham khảo đoạn code bên dưới nhé.

Hướng dẫn thực hiện

Bạn thêm đoạn code sau vào file functions.php của theme mình đang dùng nhé. Khuyến khích dùng child-theme cho nó an toàn nhé và không bị mất code khi update theme nha.

// Thêm Hotline khi sản phẩm hết hàng Woocommerce
add_filter( 'woocommerce_get_availability', 'ngocnguyen_custom_out_of_stock', 1, 2);
function ngocnguyen_custom_out_of_stock( $availability, $_product ) {
    if ( ! $_product->is_in_stock() ) {
        $hotline = '<a class="hotline-out-of-stock button" href="tel:0396753543" target="_blank" style="margin-right: 0;padding: 5px 30px;font-size: 1rem;border-radius: 8px;">Liên Hệ Đặt Hàng</a>';
        $availability['availability'] = $hotline;
    }
    return $availability;
}
// End - Thêm Hotline khi sản phẩm hết hàng Woocommerce

** Phần trong thẻ href=” “ chính là đường link bạn muốn chuyển đến khi người dùng nhấn vào nút, ở đây mình dùng link gọi đến số điện thoại, ngoài ra bạn có thể gắn bất cứ link nào bạn muốn (Zalo, Messenger…)

** Phần text “Liên Hệ Đặt Hàng” là phần nội dung nút sẽ hiển thị, bạn muốn thay đổi nó thành nội dung gì thì tùy bạn nhé

** Ngoài ra mình chỉ css một chút cho nút này thôi, bạn muốn nó đẹp hơn thì phải CSS lại nhé.

Kết quả

Trước khi thêm code

Sau khi thêm code

Vậy chỉ với vài dòng code thêm vào functions.php thì bạn có thể Thêm nút liên hệ đặt hàng khi sản phẩm hết hàng trong Woocommerce rồi nhé. Điều này sẽ giúp cho bạn gia tăng tương tác hơn với khách hàng trên website mình đấy.