Hướng dẫn hiển thị màu sắc, size,… cho sản phẩn biến thể trong Woocommerce

Có nhiều bạn inbox hỏi cách custom hiển thị màu sắc, size cho sản phẩm có biến thể trong wordpress cho nó đẹp xíu như hình bên dưới. Mặc định sản phẩm có biến thể của woocommerce rất xấu, không trực quan nên mình chia sẻ bài viết này làm cho nó đẹp hơn, người dùng dễ sử dụng 😀 .

Demo online trước nhé: Xem tại đây

Bắt đầu nhé, đầu tiên các bạn cần chuẩn bị cho mình plugin WooSwatches – Woocommerce Color or Image Variation Swatches
Bước cài đặt plugin các bạn tự tìm hiểu nhé.

B1: Mở trang chỉnh sửa sản phẩm và chọn sản phẩm biến thể  ở tab Product Data nhé.

B2: Nếu bạn chưa thêm thuộc tính thì vào tab Thuộc tính và thiết lập như bên dưới.

B3: Sau đó bạn chọn tab Các biến thể và tạo các biến thể từ các thuộc tính  – Thiết lập hình ảnh, giá cho từng biến thể và Cập nhật sản phẩm

B4: Bây giờ các bạn vào tab WooSwatcher, nhấp vào thuộc tính để cấu hình hiển thị cho nó.

Vậy là xong, lưu lại mọi thứ và cập nhật sản phẩm sau đó kiểm tra xem kết quả nhé. Chúc các bạn thành công

 

5/5 (2 Reviews)

Bình luận

  1. Bạc Tiểu Phương Có 1 bình luận

    Chào bác, cái plugin WooSwatches – Woocommerce Color or Image Variation Swatches nó chỉ hỗ trợ cách hiển thị thôi đúng không bác? Mặc định là nó theo dạng xổ xuống ạ 🙂
    Nếu chỉ có biến thể dạng size thì nó có thể tuỳ chọn cho nó dạng dàn hàng ngang không hay vẫn là dạng xổ xuống vậy ạ?

  2. duy Có 2 bình luận

    Anh Thành Trung cho em hỏi . khi vào tad thuộc tính và viết tên màu sắc thì ở giữa 2 tên màu sắc có kí tự gì vậy ạ ? Làm sao để viết kí tự đó ạ ?

Trả lời

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *

Lê Thành Trung
Web Developer
Chào bạn đến với website của mình. Mình thích chia sẻ về những kinh nghiệm trong việc lập trình Web. Cảm ơn bạn đã ghé thăm!