Hướng dẫn đăng sản phẩm có biến thể trong Woocommerce

Sản phẩm có biến thể trong WooCommerce là gì?

Khi kinh doanh online, nhiều sản phẩm không chỉ có một phiên bản duy nhất mà tồn tại dưới nhiều dạng khác nhau về màu sắc, kích cỡ, chất liệu, dung tích hay trọng lượng. Đây chính là sản phẩm có biến thể (Variable Product) trong WooCommerce. Mỗi biến thể có thể có giá riêng, tồn kho riêng và ảnh đại diện riêng, giúp khách hàng dễ dàng lựa chọn đúng phiên bản phù hợp.

Việc cấu hình đúng sản phẩm biến thể không chỉ cải thiện trải nghiệm mua sắm mà còn giúp website của bạn quản lý kho hàng chính xác hơn. Nếu bạn đang dùng hosting chưa đủ mạnh để vận hành WooCommerce mượt mà, hãy tham khảo gói hosting tốc độ cao tại ThemeWP.vn để trang web luôn hoạt động ổn định.

Bước 1: Kích hoạt cài đặt biến thể trong theme Flatsome

Hướng dẫn này áp dụng cho theme Flatsome phiên bản 3.14 trở lên. Nếu bạn không dùng Flatsome, có thể sử dụng các plugin thay thế như Additional Variation Images Gallery for WooCommerce hoặc WooSwatches với thao tác tương tự.

Để bật tính năng hiển thị biến thể dạng nút trực quan (swatches), thực hiện theo đường dẫn:

Admin > Flatsome > Advanced > WooCommerce

Tại đây, tích chọn ô VARIATION SWATCHES rồi nhấn lưu cài đặt. Sau bước này, hệ thống sẽ hỗ trợ hiển thị thuộc tính sản phẩm dưới dạng ô màu, hình ảnh hoặc nhãn chữ thay vì dropdown thông thường.

Bước 2: Tạo thuộc tính sản phẩm trong WooCommerce

Thuộc tính (attribute) là nền tảng để tạo biến thể. Mỗi thuộc tính đại diện cho một tiêu chí phân loại sản phẩm như màu sắc, kích cỡ, chất liệu, dung tích hay thương hiệu.

Truy cập: Admin > Sản phẩm > Các thuộc tính

Các trường cần điền khi tạo thuộc tính mới

Tên: Nhập tên thuộc tính, ví dụ “Màu sắc”, “Kích cỡ”, “Chất liệu”.

Đường dẫn tĩnh (Slug): Có thể bỏ qua, hệ thống tự tạo.

Cho phép lưu trữ: Tích vào ô này để thuộc tính được lưu và tái sử dụng cho nhiều sản phẩm.

Loại hiển thị: Đây là tùy chọn quan trọng xác định cách biến thể hiển thị trên trang sản phẩm:

• UX Color: Hiển thị dưới dạng ô màu, phù hợp với thuộc tính màu sắc.
• UX Image: Hiển thị dưới dạng ảnh thu nhỏ, phù hợp khi mỗi biến thể có hình ảnh riêng.
• UX Label: Hiển thị dưới dạng nhãn chữ, phù hợp với kích cỡ, số đo.

Swatch size & Swatch shape: Tùy chỉnh kích thước và hình dạng nút hiển thị. Có thể bỏ qua và tinh chỉnh sau trong phần Tùy biến.

Use variation images: Bật tùy chọn này để hệ thống tự lấy ảnh từ từng biến thể sản phẩm làm ảnh đại diện cho thuộc tính đó.

Bước 3: Cấu hình chủng loại (terms) của từng thuộc tính

Sau khi tạo thuộc tính, bạn cần thêm các giá trị cụ thể (terms) cho từng thuộc tính đó. Ví dụ: thuộc tính “Màu sắc” cần có các giá trị như Đỏ, Xanh, Đen, Trắng.

Nhấn vào tên thuộc tính vừa tạo để mở giao diện quản lý chủng loại. Tại đây, bạn thêm từng giá trị và cấu hình thêm:

• Với UX Color: Chọn mã màu hex tương ứng với từng giá trị.
• Với UX Image: Tải ảnh đại diện cho từng giá trị.
• Với UX Label: Nhập nhãn chữ ngắn gọn, rõ ràng.

Việc thiết lập đầy đủ ở bước này giúp giao diện trang sản phẩm hiển thị trực quan và chuyên nghiệp hơn nhiều so với dropdown mặc định.

Bước 4: Tạo sản phẩm có nhiều biến thể trong WooCommerce

Đây là bước quan trọng nhất. Vào Sản phẩm > Thêm mới, nhập tên và mô tả sản phẩm. Trong khung Dữ liệu sản phẩm, mở dropdown và chọn Sản phẩm có biến thể thay vì Sản phẩm đơn giản.

Cách thêm thuộc tính vào sản phẩm

Trong phần Dữ liệu sản phẩm, chọn tab Thuộc tính, sau đó chọn thuộc tính đã tạo ở bước trước từ dropdown rồi nhấn Thêm. Tích vào ô Được dùng cho các biến thể để WooCommerce có thể tạo biến thể từ thuộc tính này. Nhấn Lưu các thuộc tính trước khi sang bước tiếp theo.

Cách tạo các biến thể cụ thể

Chuyển sang tab Các biến thể, chọn Tạo biến thể từ tất cả các thuộc tính trong dropdown rồi nhấn Thực hiện. WooCommerce sẽ tự động tạo tất cả tổ hợp biến thể. Nhấn vào từng biến thể để mở rộng và cấu hình riêng:

• Giá thường và giá khuyến mãi
• SKU và tình trạng tồn kho
• Trọng lượng và kích thước vận chuyển
• Ảnh đại diện riêng cho từng biến thể

Ảnh của mỗi biến thể sẽ tự động hiển thị khi khách hàng chọn biến thể đó trên trang sản phẩm, tạo ra trải nghiệm mua sắm trực quan và chuyên nghiệp. Lưu ý bắt buộc phải nhập giá cho từng biến thể, nếu không biến thể đó sẽ không hiển thị ngoài frontend.

Ví dụ cấu hình thực tế

Giả sử bạn bán áo thun với 2 thuộc tính:

• Màu sắc để dạng UX Image: Hệ thống lấy ảnh từng biến thể màu làm ảnh đại diện, tự động đổi ảnh sản phẩm khi khách chọn màu.
• Kích cỡ để dạng UX Label: Hiển thị các nhãn S, M, L, XL dạng nút bấm thay vì dropdown.

Sau khi xuất bản, khách hàng nhấn vào ô màu để chọn màu, nhấn vào nhãn để chọn size, ảnh sản phẩm cập nhật tương ứng theo lựa chọn.

Hiển thị biến thể trên trang danh mục sản phẩm

Ngoài trang chi tiết sản phẩm, bạn cũng có thể cấu hình để biến thể hiển thị ngay tại trang danh mục. Thực hiện theo đường dẫn:

Giao diện > Tùy biến > WooCommerce > Danh mục sản phẩm

Kéo xuống phần Swatches và bật tùy chọn hiển thị. Khi đó, khách hàng có thể chọn biến thể ngay từ trang danh mục mà không cần vào trang chi tiết sản phẩm, giúp tăng tỷ lệ chuyển đổi đáng kể.

Nếu gặp khó khăn trong quá trình cấu hình, bạn có thể sử dụng dịch vụ hỗ trợ kỹ thuật tại ThemeWP.vn để được trợ giúp trực tiếp.

Lưu ý quan trọng khi đăng sản phẩm có biến thể

• Luôn tích chọn Used for variations khi thêm thuộc tính vào sản phẩm, nếu không WooCommerce sẽ không tạo được biến thể.
• Mỗi biến thể nên có ảnh riêng để trải nghiệm người dùng tốt hơn.
• Giới hạn mặc định của WooCommerce là 50 biến thể mỗi lần tạo tự động. Với sản phẩm nhiều thuộc tính hơn, bạn cần tăng giới hạn hoặc tạo thủ công.
• Nên đặt giá cho tất cả biến thể để tránh lỗi hiển thị trên frontend.
• Nếu website bạn có lượng sản phẩm lớn, hosting NVME tốc độ cao sẽ giúp trang admin và frontend hoạt động mượt mà hơn nhiều.

Bạn cũng có thể khám phá thêm kho theme WooCommerce tại ThemeWP.vn để tìm giao diện hỗ trợ sẵn tính năng biến thể đẹp và chuyên nghiệp. Mọi thắc mắc, liên hệ với đội ngũ ThemeWP.vn để được tư vấn miễn phí.

FAQ về đăng sản phẩm có biến thể trong WooCommerce

Sản phẩm có biến thể khác sản phẩm đơn giản ở điểm nào?

Sản phẩm đơn giản (Simple product) chỉ có một phiên bản duy nhất với một giá cố định. Sản phẩm có biến thể (Variable product) cho phép tạo nhiều phiên bản khác nhau, mỗi phiên bản có thể có giá, ảnh, tồn kho và thông số riêng biệt.

Có thể tạo sản phẩm biến thể mà không cần theme Flatsome không?

Hoàn toàn có thể. Tính năng sản phẩm biến thể là tính năng gốc của WooCommerce, không phụ thuộc vào theme. Tuy nhiên, để hiển thị biến thể dạng swatches đẹp (ô màu, ảnh, nhãn chữ), bạn cần theme hỗ trợ như Flatsome hoặc cài thêm plugin như WooSwatches hoặc Variation Swatches for WooCommerce.

Tại sao nút Generate variations không tạo ra biến thể nào?

Nguyên nhân phổ biến nhất là bạn chưa tích vào ô Used for variations khi thêm thuộc tính vào sản phẩm. Ngoài ra, cần đảm bảo thuộc tính đã có ít nhất một giá trị (term) được gán cho sản phẩm trước khi tạo biến thể.

WooCommerce cho phép tạo tối đa bao nhiêu biến thể cho một sản phẩm?

Mặc định, WooCommerce giới hạn 50 biến thể mỗi lần tạo tự động. Về mặt kỹ thuật, không có giới hạn cứng về tổng số biến thể, nhưng quá nhiều biến thể (trên 100) có thể ảnh hưởng đến tốc độ tải trang. Nên giữ số lượng biến thể ở mức hợp lý và đầu tư vào hosting tốt để đảm bảo hiệu năng.

Có thể ẩn một biến thể cụ thể mà không xóa nó không?

Có. Trong phần quản lý từng biến thể, bạn có thể bỏ tích ô Enabled để tắt biến thể đó. Biến thể bị tắt sẽ không hiển thị cho khách hàng nhưng vẫn được lưu trong hệ thống để kích hoạt lại khi cần.

Ảnh biến thể có ảnh hưởng đến SEO hình ảnh không?

Có. Mỗi ảnh biến thể nên được đặt tên file và alt text mô tả chính xác sản phẩm và thuộc tính tương ứng. Điều này giúp Google Image Search hiểu đúng nội dung ảnh và cải thiện khả năng xuất hiện trong kết quả tìm kiếm hình ảnh.