Để đăng sản phẩm có nhiều biến thể khác nhau về giá, trọng lượng, dung tích, màu sắc, kích cỡ, chất liệu,… bạn cần cập nhật thông tin chi tiết cho từng biến thể. Điều này sẽ phức tạp hơn so với đăng sản phẩm đơn giản thông thường. Tuy nhiên, bài viết này sẽ hướng dẫn bạn cách đăng sản phẩm có biến thể trên Flatsome phiên bản 3.14 trở lên hoặc các plugin Additional Variation Images Gallery for WooCommerce hoặc WooSwatches – Woocommerce Color or Image Variation Swatches có thể sử dụng tương tự.
Bước 1: Bật tùy chọn nhiều biến thể
Đi đến Admin > Flatsome > Advanced > Woocommerce
Chọn ô VARIATION SWATCHES và lưu cài đặt.
Bước 2: Tạo thuộc tính cho sản phẩm
Đi đến Admin > Sản phẩm > Các thuộc tính
Có thể tạo các thuộc tính như trọng lượng, dung tích, màu sắc, kích thước, chất liệu, thương hiệu,.. Theo định nghĩa của bạn. Những thuộc tính này có thể khác nhau về giá hoặc đơn giản là bạn muốn tách ra thành 2 sản phẩm riêng biệt để khách hàng lựa chọn.
Tạo thuộc tính
Tên: Tên thuộc tính
Đường dẫn tĩnh: Không cần quan tâm
Cho phép lưu trữ: Chọn để lưu trữ và sử dụng nhiều lần.
Loại: Có ba lựa chọn:
– UX Color: Hiển thị thuộc tính theo màu sắc
– UX Image: Hiển thị thuộc tính bằng hình ảnh
– UX Label: Hiển thị thuộc tính dưới dạng chữ (text)
Swatch size: Kích thước hiển thị của thuộc tính trong trang chi tiết sản phẩm, sau này có thể tinh chỉnh.
Swatch shape: Kiểu hình dạng hiển thị thuộc tính trong trang chi tiết sản phẩm, sau này có thể tinh chỉnh.
Use variation images: Sử dụng ảnh của thuộc tính sản phẩm làm ảnh hiển thị của thuộc tính.
Bước 3: Thiết lập loại thuộc tính sản phẩm
Để thêm các thuộc tính cho sản phẩm, bạn chỉ cần nhấp vào đây.

Ví dụ, nếu bạn muốn thêm thuộc tính màu sắc, bạn có thể chọn màu sắc trong phần UX Color bên dưới, tương tự với UX Label hay UX Image.
Bước 4: Tạo sản phẩm có nhiều biến thể
Với dạng sản phẩm đơn giản nếu bạn dùng UX Image thì tại phần Cấu hình chủng loại của thuộc tính sản phẩm bạn cần chọn mình ảnh cho từng thuộc tính.
Với dạng sản phẩm có biến thể thì các thuộc tính bạn tạo sẽ được lấy thông tin, hình ảnh từ phần Các biến thể, ví dụ dưới đây là cài đặt cơ bản



Phần Màu sắc để dạng UX Image
Phần Size mình để dạng UX Label
Và đây là kết quả

Nếu bạn muốn hiển thị thuộc tính màu sắc hoặc bất cứ thuộc tính nào khác như thế này:

Bạn làm như sau nhé: Giao diện > Tùy biến > Woocommerce > Danh mục sản phẩm
Kéo xuống đến phần Swatches và cấu hình như mình là sẽ được như bên trên.

Chúc bạn thành công!
- Cách Ngăn Chặn Bình Luận Spam Trên Website WordPress Hiệu Quả
- Cách mở tên miền domain bị chặn do vi phạm chính sách bảo mật chung Zalo
- Hướng dẫn đổi mật khẩu và email quản trị Admin WordPress dễ dàng
- Nguyên nhân và cách khắc phục lỗi không cài đặt được Theme Plugin
- Xử lý lỗi “Please activate the theme, now the theme is not active” khi cài theme

Website Trung Tâm Anh Ngữ - Full Source Code
Website Bất Động Sản 38 - Full Source Code
Website Biển Quảng Cáo - Thiết Kế Thi Công - Full Source Code
Website Thời Trang Cao Cấp - Shop Online - Full Source Code
Website Máy Photocopy - Thiết Bị Văn Phòng - Shop Online - Full Source Code
Website Dược Phẩm Thuốc Nam 02 - Shop Online - Full Source Code
Website Bán Sản Phẩm Túi Da - Shop Online - Full Source Code
Website Khách Sạn 02 - Full Source Code
Website Bán Túi Xách - Shop Online - Full Source Code
Website Dịch Vụ Xuất Bản Sách - Full Source Code
Website Bán Và Cho Thuê Máy Photocopy - Full Source Code
Website Nội Thất 08 - Shop Online - Full Source Code
Website Kho Gạch Men Giá Rẻ - Vật Liệu Xây Dựng - Shop Online - Full Source Code
Website Dược Phẩm Thuốc Nam - Nhà Thuốc - Shop Online - Full Source Code
Website Cửa Hàng Bán Hoa 06 - Hoa Tươi - Trang Trí Sự Kiện - Shop Online - Full Source Code
Website Thi Công Hồ Cá Koi Tiểu Cảnh - Full Source Code
Website Thiết Bị Nhà Tắm - Shop Online - Full Source Code
Website Tin Tức 09 - Blog - Full Source Code
Website Thực Phẩm Chức Năng 01 - Shop Online - Full Source Code
Website Bán File Theme Plugin - Giao Diện Website - Shop Online - Mmo - Full Source Code
Website Bất Động Sản 32 - Full Source Code
Website Giới Thiệu Sách Nói USB - Shop Online - Full Source Code
Website Bán Ghế Massage - Shop Online - Full Source Code
Website Showroom Ô Tô 03 - Mua Bán Xe - Full Source Code
Flatsome Multi Purpose Responsive WooCommerce Theme
All in One WP Migration Unlimited Extension
Khóa học Bí Kíp Xây Dựng Website Bán Hàng Trực Tuyến với WordPress và Theme Flatsome
Dịch Vụ Cài Đặt Website Từ Source Code 










