Cách Chuyển Đổi Từ Dropdown Sang Nút Radio Trên Website Sử Dụng Flatsome

Bạn muốn chuyển đổi từ dropdown sang nút radio trên trang web của mình sử dụng Flatsome không?

Khi một sản phẩm có các thuộc tính hoặc biến thể có thể chọn, lựa chọn duy nhất có sẵn là chọn từ danh sách dropdown.

Nhưng, với tư cách là chủ sở hữu cửa hàng trực tuyến, bạn nên cho phép khách hàng của mình xem tất cả các tùy chọn có sẵn mà không cần phải cuộn qua menu dropdown.

Trong WooCommerce chuẩn, nút radio không có sẵn cho sản phẩm. Nó đi kèm với danh sách dropdown và ẩn tất cả các tùy chọn có thể cho đến khi bạn nhấp vào chúng.

Trong hướng dẫn Flatsome này, chúng tôi sẽ chỉ cho bạn cách thay đổi từ dropdown sang nút radio trên Flatsome.

Các video dưới đây cho thấy cách tạo swatches nút radio từ đầu.

 

https://www.youtube.com/watch?v=XY6GjG3yPUU

Cách Chuyển Đổi Dropdown Sang Nút Radio trên Flatsome

 

Swatches Biến thể WooCommerce

Nói chung, bạn cần plugin Swatches Biến thể WooCommerce để chuyển đổi dropdown mặc định thành nút radio.

Swatches Biến thể cho plugin WooCommerce đã làm cho việc cải thiện cách hiển thị các thuộc tính của bạn bằng nút radio trở nên đơn giản.

 
 
 
 

Hơn nữa, nó cho phép bạn chuyển đổi dropdown thành hình ảnh, nhãn/nút và swatches màu WooCommerce.

Nếu bạn kiểm tra WooCommerce mặc định, bạn sẽ thấy không có tùy chọn nào để kích hoạt hình ảnh, màu sắc và nút radio.

 
 
without radio button
 
 

Một khi bạn cài đặt plugin Swatches Biến thể cho WooCommerce, bạn sẽ nhận thấy các tùy chọn khác nhau dưới Loại như Màu sắc, Hình ảnh và Nút.

Bạn có thể tải xuống phiên bản miễn phí từ kho lưu trữ WordPress hoặc tải lên/cài đặt trực tiếp từ bảng điều khiển WordPress.

 
 
radio button missing
 
 

Nhưng, cho Radio, bạn cần mua phiên bản cao cấp để kích hoạt tính năng nút radio.

Tính năng swatches radio là phiên bản chuyên nghiệp của plugin Swatches Biến thể WooCommerce.

Cấu hình:

Bạn cần cài đặt phiên bản miễn phí của plugin Swatches Biến thể WooCommerce. Phiên bản pro là sự mở rộng của Swatches Biến thể WooCommerce.

Sau khi bạn hoàn thành cài đặt và kích hoạt, đã đến lúc tạo các thuộc tính như swatches hình ảnh cho các biến thể sản phẩm của bạn. Có một tùy chọn để chỉnh sửa các biến thể hiện có cũng như vậy.

Chỉ cần làm theo các bước dưới đây:

  • Đi tới Thuộc tính từ mục Sản phẩm.
  • Điền vào trường ‘Tên‘, và slug là tùy chọn. (Vì mục đích trình diễn, tôi đã đặt tên thuộc tính: Kích thước).
  • Chọn loại thuộc tính của bạn là ‘Radio‘ từ menu thả xuống ‘Loại’.
 
 
radio button option
 
 

Khi bạn thêm các thuộc tính, nhấp vào ‘Cấu hình thuật ngữ‘ từ danh sách thuộc tính để tạo các biến thể sản phẩm.

 
 
 
 

Bây giờ, tạo các biến thể bên trong thuộc tính loại radio. Điền tên với tên biến thể mong muốn của bạn. Tiếp tục thêm các thuộc tính mới bằng cách nhấp vào nút Thêm kích thước mới.

 
 
 
 

Bây giờ, bạn cần thêm chi tiết cụ thể cho từng biến thể và tùy chỉnh các cài đặt còn lại.

Sau khi bạn hoàn thành tất cả các bước cần thiết, kiểm tra giao diện sản phẩm của bạn.

Đó là tất cả. Bạn đã kích hoạt nút radio trên cửa hàng WooCommerce được hỗ trợ bởi Flatsome của mình.

Tùy chọn sản phẩm biến thể của bạn sẽ trở nên dễ nhấp và thân thiện với người dùng hơn. Thêm vào đó, tùy chọn nút radio là một lựa chọn tốt hơn để chọn các tùy chọn biến thể. Nó sẽ giúp bạn có được nhiều đơn hàng hơn.

 

Để lại một bình luận

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 *