Variable products là một loại sản phẩm trong WooCommerce cho phép bạn cung cấp một tập hợp các biến thể trên một sản phẩm với giá, trạng thái, hình ảnh, và nhiều hơn nữa.
Thêm thuộc tính cho sản phẩm
Để thêm thuộc tính cho sản phẩm bạn vào phần Products -> Attributes
Trong này bạn chọn các trường như Name (Tên thuộc tính), Slug, Type (Kiểu hiển thị), Default sort order (Cách sắp xếp). Xong bạn nhấn Add Attribute.
Đối với thuộc tính kiểu Select, chúng ta thêm các giá trị cho thuộc tính bằng cách bạn vào phần Configure Terms, là phần khoanh đỏ như hình bên dưới:
Bạn điền các thông tin của giá trị, có thể thêm phần mô tả tại phần Description. Xong bạn nhấn Add New…
Đối với các giá trị khác bạn cũng làm tương tự, ta được các giá trị để chọn lựa khi đăng sản phẩm.
Thêm các thuộc tính sẽ hiển thị tùy chọn cho sản phẩm
Để thêm một Variable product, bạn chỉnh sửa một sản phẩm hiện có hoặc tạo một sản phẩm mới bằng cách vào: Products > Products. Bạn có thể chọn nút Add Products hoặc chỉnh sửa một sản phẩm hiện có.
Kéo xuống phía dưới phần Product Data, chúng ta chọn giá trị Variable product.
Trong phần thuộc tính, bạn sẽ cần phải thêm các thuộc tính đầu tiên trước khi chúng ta có thể tạo ra các biến thể (Variable) – Bạn có thể sử dụng các thuộc tính toàn cầu (các thuộc tính đã tạo sẵn) hoặc xác định những tùy chỉnh cụ thể cho từng sản phẩm. Để sử dụng một thuộc tính toàn cầu chọn nó từ danh sách và sau đó chọn Add.
Bạn hãy chọn Select all các nút để thêm tất cả các thuộc tính cho các sản phẩm hoặc chọn các thuộc tính thuộc về sản phẩm, và nhớ check vào phần Used for variations.
Xong bạn nhấn Save attributes. Sau khi lưu thay đổi của bạn, bây giờ bạn có thể bắt đầu cài đặt chúng lên trên một sản phẩm. Bạn vào phần Variations.
Đầu tiên, chúng tôi muốn khuyên bạn nên thiết lập giá trị hiển thị mặc định của thuộc tính. Trong ví dụ của chúng tôi, chúng tôi không có bất kỳ thiết lập mặc định, vì vậy người dùng có thể chọn bất kỳ màu sắc và kích thước ngay từ trang sản phẩm. Nhưng nếu bạn muốn một sự thay đổi nào đó đã chọn khi người dùng truy cập các trang sản phẩm, bạn có thể thiết lập những người ở đây.
Bạn có thể chọn Link all variations để tạo mọi sự kết hợp có thể có của các biến thể. Bạn cũng có thể tạo ra những kết hợp bằng cách chọn Add Variation. Một bảng các giá trị sẽ xuất hiện, sẵn sàng cho bạn nhập dữ liệu đầu vào.
Bạn chọn Enable cho tất cả các kết hợp bạn muốn hiển thị. Sau đó bạn nhấn Publish hoặc update sản phẩm.
Bạn có thể nhập các thuộc tính khác của sản phẩm như giá, giá khuyến mãi, trạng thái… Ví dụ cho giá: Bạn nhấn chọn Choose a field to bulk edit… Chọn Prices, nhấn Go. Sau đó nhập vào giá trị, nhấn ok. Làm tương tự với Sale Prices.
Xem sản phẩm để thấy kết quả ngoài Frontend của quá trình thực hiện.
Người dùng có thể chọn các giá trị thuộc tính khi đặt hàng. Ví dụ ở đây: Độ tuổi, Màu sắc, Cân nặng. Sau đó nút Thêm vào giỏ hàng sẽ xuất hiện. Và nhấn chọn thêm vào đơn hàng.
Như vậy, qua bài viết này bạn đã biết cách thiết lập các thuộc tính mở rộng cho sản phẩm trên WooCommerce, hãy đón đọc những bài viết khác liên quan đến thiết lập trang shop với WooCommerce trên website Học WordPress các bạn nhé. Chúc các bạn thành công!
Không liên quan đến nội dung bài viết nhưng cho mình hỏi 1 câu nhé ads
Cái widget NỔI BẬT TRONG TUẦN bạn dùng plugin nào để hiện thị mà nó chạy 1 post rồi delay 1 tí lại chạy vậy bạn
Cái này không phải plugin nha bạn, mình tự viết truy vấn và sử dụng bxSlider.
cho mình hỏi làm sao hiển thị được thêm vào gió vậy? mình làm toàn hiển thỉ ad….
Chào bạn, chữ Thêm vào giỏ chỉ là dịch ngôn ngữ thôi, bạn cũng có thể viết trang hiển thị sản phẩm tùy chỉnh.
Hi bạn, bạn cho mình hỏi một chút. Sản phẩm có trường giá,khi đăng sản phẩm sẽ nhập giá cho sản phẩm.Tuy nhiên sản phẩm của mình đặc thù nên không có giá. Ngoài website mình muốn để là” Giá: liên hệ” nhưng trường giá của woo cần phải nhập số nên không làm được.
Bạn hướng dẫn mình với.
Cám ơn
add code sau:
* WooCommerce Extra Feature
* ————————–
*
* Replace “Free!” by a custom string
*
*/
function woo_my_custom_free_message() {
return “Liên hệ”;
}
vào file funtion.php của theme nha
Cảm ơn bạn đã chia sẻ cùng mọi người.
Cho mình hỏi về Woocommerce?
Ở cái phần giá ở dưới sản phẩm, thay vì giá mình không để giá mà mình ghi chữ liên hệ. Nhưng ở đây mình khôn ghi được, bạn chỉ giúp mình làm phần này nhé, thanks bạn.
Chào bạn, để có thể hiển thị text cho sản phẩm không có giá thì bạn có thể dùng filter như bên dưới:
[php]
function hocwp_wc_no_price_text($price) {
if(empty($price)) {
$price = ‘Xin vui lòng liên hệ’;
}
return $price;
}
add_filter(‘woocommerce_get_price_html’, ‘hocwp_wc_no_price_text’);
[/php]
Bạn thêm code vào functions.php của giao diện hoặc bất kỳ chỗ nào có thể chạy được nha bạn.
cho e hỏi làm sao để hiển thị chữ Sale ở góc trái đó ạ
Cái đó mặc định WooCommerce đã hỗ trợ rồi mà bạn? Hay là bạn dùng template tự viết?
làm sao hiển thị sản phẩm bán chạy ? có thể code functions ko? có thì chỉ mình code ntn với! tks! mình đang làm dự án WP bán hàng.
Chào bạn, để lấy được sản phẩm bán chạy trong WooCommerce, bạn có thể tham khảo danh sách shortcode của plugin này cung cấp:
https://docs.woothemes.com/document/woocommerce-shortcodes/
Ngoài ra, bạn cũng có thể viết truy vấn theo meta, để làm được cái này thì bạn phải biết code:
https://wordpress.org/support/topic/how-to-get-woocommerce-best-selling-product-via-loop?replies=4
cảm ơn bạn nhiều!
mình làm cũng được được phần này rồi!
Bạn có thể hướng dẫn mình làm sao để hiện quick view ngay trên hình sản phẩm và rating stars bên dưới sản phẩm hok ? mình đang vướng phần này @@
Cái xem nhanh thì bạn có thể dùng plugin YITH WooCommerce Quick View:
https://wordpress.org/plugins/yith-woocommerce-quick-view/screenshots/
Trong vòng lặp của bạn thử dùng đoạn code bên dưới nhé:
[php]
<div class="product-rating">
<?php if ($average = $product->get_average_rating()) : ?>
<?php echo ‘<div class="star-rating" title="’.sprintf(__( ‘Rated %s out of 5’, ‘woocommerce’ ), $average).’"><span style="width:’.( ( $average / 5 ) * 100 ) . ‘%"><strong itemprop="ratingValue" class="rating">’.$average.'</strong> ‘.__( ‘out of 5’, ‘woocommerce’ ).'</span></div>’; ?>
<?php endif; ?>
</div>
Nhớ là thêm biến toàn cục $product nhé.
[/php]
ah! ok tks bạn nhiều 🙂
mà cái YITH WooCommerce Quick View này là bản lite bạn ơi! bản pro mới làm cho hoàn hảo được ! 🙂
Đâu có bữa tiệc nào miễn phí hoàn toàn đâu bạn, người ta bỏ công sức ra viết code cũng phải để người ta kiếm cơm chứ :p.
Nếu được thì bạn nên mua luôn bản pro để sử dụng.
=)) cảm ơn bạn! bạn có thể giúp mình giải đáp phần này được ko?
hiện mình đang cần làm cái back end để quản lý trang web bán hàng của cty! mà mình chưa có hướng giải quyết nó như thế nào.
chỉ cần back end hiện được phần quản lý đơn đặt hàng, phần feedback và sđt, email của khách hàng thôi! làm trên WP mà mình mới tham gia vào wp nên cũng chưa biết giải quyết sao?
Mong bạn giúp đỡ giải đáp! tks …! merry christmas 🙂
Cho hỏi thay vì mình để lựa chọn xổ xuống để chọn màu thì mình cho nó thành hình ảnh mỗi màu được không ?
Bạn ơi cho mình hỏi mình muốn thêm thuộc tính vào dưới chuyên mục! ví dụ muốn thêm thuộc tính nhà sản xuất, thương hiệu .v…v thì làm như nào b
Chào bạn, trong sản phẩm bạn có thể thêm nhiều thông tin bổ sung, nhưng để nó hiển thị được theo ý của bạn thì e rằng bạn không biết code thì không làm được.
Bác cho m hỏi m đăng sản phẩm nhiều biến thể với mỗi màu sẽ có 1 giá khác nhau.nhưng ở phần giá chung nó lại hiển thị 2 giá từ biến thể có giá thấp nhất đến biến thể có giá cao nhất.Giờ m chỉ muốn hiển thị biến thể có giá thấp nhất làm mặc định giá cho sản phẩm đó còn khi nào khách vào chọn màu khác mới hiển thị giá khác.Mong bác giúp e với ak
Ảnh nó đây ak
cho mình hỏi plugin nào hộ chợ rê chuột vào nó hiển thị vắn tắt các thông tin của sản phẩm ? thank
Cảm ơn bạn vì nội dung chất lượng, dễ hiểu. Mong rằng bác cường sẽ ra nhiều bài viết để cộng đồng cùng học hỏi 🙂
admin cho mình hỏi muốn đổi chữ “Thêm vào giỏ” thành 1 chữ nào đó khác thì làm thế nào ạ. tks admin
Bạn thay đổi chữ Add to cart tại đây nhé:
https://docs.woothemes.com/document/change-add-to-cart-button-text/
Bạn cho mình hỏi, muốn xuất hiện nút SKU ở trên sản phẩm thì làm sao ?
Chào bạn, bạn có thể sử dụng những hook mà WooCommerce đã cung cấp sẵn cho người dùng:
[php]
function hocwp_wc_single_product_summary(){
global $product;
echo ‘SKU: ‘ . $product->get_sku();
}
add_action( ‘woocommerce_single_product_summary’, ‘hocwp_wc_single_product_summary’, 5 );
[/php]
Anh Cường cho em hỏi xíu…Trên Web em có một số sản phẩm em để giá = 0 thì nó hiển thị là Miễn Phí!. Có cách thay chữ Miễn Phí! bằng Liên Hệ hoặc Số điện thoại được không anh??
Cám ơn!
Chào bạn, bạn có thể dùng filter woocommerce_get_price_html để thay đổi chữ hiển thị nhé.
https://docs.woocommerce.com/wc-apidocs/source-class-WC_Product_Grouped.html#162
cho mình hỏi là mình muốn giới hạn thơi gian khuyến mại thì làm sao ak
Bạn nhìn bên phải mục nhập giá giảm giá có dòng chữ đặt lịch (Schedule) trong khoảng thời gian nha bạn.
sản phẩm của tôi có nhiều kích thước khác nhau khi hiện ở nọ sẽ hiện 2 giá thấp nhất và cao nhất vậy có sửa được ko ad ơi.
Cho mình hỏi, sản phẩm biến thể mình giá mặc định đều bằng nhau thì có cách nào nhập giá mặc định không, vì sản phẩm biến thể mình không tìm được chổ nào nhập giá cả (chỉ có ở sản phẩm cơ bản thôi). Help me!!!
Để có thể tạo được giá khác nhau cho các loại sản phẩm khác nhau thì bạn phải thêm Attributes cho sản phẩm trước. Bạn vào tạo sản phẩm mới, trong box Product data của WooCommerce, bạn chọn loại sản phẩm là Variable product. Tiếp đến, trong tab Attributes, bạn nhấn Add custom product attribute, điền vào Name và value, ví dụ Name bạn điền là Color thì Value bạn điền là Red|Black|White. Sau khi lưu xong Attributes thì bạn mới có thể vào tab Variations, chọn Add variation để thêm từng cái một hoặc chọn Create variations from all… Đọc tiếp »
tiep tuc cau hoi cua anh tren … vd san pham em co cac bien nhu sau : Mau Sac ( Vàng , Đen ,Trắng , GOld ) , các gói bảo hành thêm ( 1 tháng 2 thagns 3 tháng ) các tình trạng ( 97% 98% ((% ) … Nếu tổng hợp add các biến thể này với nhau thì có tận tren 30 thuộc tính … vậy thì làm sao mình thêm giá khác cho từng sản phẩm nổi ạ … còn cách nào khác dể dàng hơn ko ạ … em đang bi rồi chỗ này… Đọc tiếp »
Cho mình hỏi: Tại sao trong giao diện tạo thuộc tính của mình k có mục tùy chọn “loại” vậy bạn? có phải tại mình cài bản wp việt nam k?
Loại gì bạn? Nếu bạn muốn tạo ra bất kỳ thuộc tính nào thì sử dụng chức năng Attribute của WC nhé.
Là trường “type” (kiểu hiển thị) đó bạn, trong giao diện khởi tạo Attribute của mình chỉ có 3 trường kia thôi chứ không có trường type bạn ạ?
Có cách nào tính giá theo số lượng ko ad.
Ví dụ 50 cái thì giảm thêm 5% tới 100 cái thì giảm giá 10%
Bạn thử dùng plugin WooCommerce Bulk Discount thử nhé: https://wordpress.org/plugins/woocommerce-bulk-discount/
Ad cho hỏi phần Variations (các thuộc tính) và các phần khác trong woocommerce theo hình đính kèm sao lại lỗi không hiển thị gì nhỉ ?
link onedrive: https://1drv.ms/u/s!ArEqWka7-x-Tga8xcKbhZV993TgFHw
Cái đó có thể do giao diện hoặc plugin khác. Bạn chuyển về giao diện mặc định xem sao nhé.
Ok để mình xoay thử. Tks ad
Khi nào tìm ra nguyên nhân nhớ chia sẻ cùng mọi người nha bạn 🙂
Cái này do lỗi theme không tương thích với woocommerce. Thay theme (template) khác là được
Không hiểu sao website của mình, khi thêm thuộc tính mới thì không có phần lựa chọn kiểu thuộc tính(văn bản, lựa chọn). Vậy là sao hả b, giải thích giúp m với. Cảm ơn b
Ý bạn là chọn kiểu thuộc tính bên ngoài trang single product hay sao? Nếu là vậy thì do giao diện không hỗ trợ nha bạn. Tốt nhất bạn nên thử với giao diện mặc định Storefront của WooCommerce nhé.
Thank bạn. Đúng cái mình cần tìm
Cho mình hỏi cái nhé!
khi mình chọn các lựa chọn sản phẩm (như chọn mỗi màu mỗi giá) thì giá nó nằm ngay bên dưới lựa chọn, >> làm sao mình cho giá nó lên trên thay vô vị trí của giá sản phẩm được nhỉ: như sản phẩm này nè: https://www.hnammobile.com/dien…/iphone-x-plus.14334.html khi mình bấm chọn màu giá nó tự thay đổi ở trên luôn
Tình hình là khi cài đặt thuộc tính cho sản phẩm trong woocommerce (như color, Size..) thay vì hiện trong phần mua hàng để mình chọn từng loại để mua, Thì nó chỉ hiển thị trong phần thông tin bổ sung chứ không hiện trên nút thêm vào giỏ hàng Anh em nào rành woocommerce xin giúp đỡ, mình potay dù làm thế nào nó ko hiện trên nút thêm vào giỏ hàng… sài wordpress 4.9.9(đã lên bản mới nhất nhưng vẫn bị), theme flatsome mình cũng thử hạ bản woocommerce xuống từ 3.5.5 xuống 3.4.7 nhưng vẫn lỗi….. https://prnt.sc/mrmoz1… Đọc tiếp »
Cái này có thể là giao diện họ làm vậy, bạn thử chuyển giao diện xem sao nhé. Có thể thử trên giao diện Storefront của WooCommerce.
Giao diện flatsome này chắc ko phải lỗi, lúc trước mình đã chạy 1 site và bình thường, ko biết gần đây cài site mới thì bị như vậy….
cái này lỗi do mình, minh ko chọn các biến thể, mà chọn sản phẩm đơn giản, nên vì vậy hiện trong phần mô tả. mình phải tạo ra các biến thể thuộc tính, rồi thêm giá vào thì mới có các lua chon Size, color….. Lâu quá không sử dụng WooCommerce nên quên.. hixx
cảm ơn bạn đã chia sẻ
Chào ad, a có thể hướng dẫn thiết kế lại giao diện trang chi tiết sản phẩm như của anh được không ạ ?
Chào bạn, không biết bạn muốn thiết kế trang sản phẩm như thế nào? Có phải chỉ hiển thị như bài viết bình thường?
https://vuanem.com/nem-gummi-lafo.html
Có thể hướng dẫn custom như trang chi tiết sản phẩm nào được không ạ ad? Vì e thấy nhiều người rất quan tâm về giao diện trang chi tiết sản phẩm ạ. Nếu được mong ad bỏ chút thời gian để hướng dẫn với ạ, E cảm ơn ad, chúc a thật nhiều sức khỏe ạ.
Chào bạn, để làm được trang xem sản phẩm như bạn gửi thì cần phải biết code và edit template của WooCommerce. Tốt nhất là bạn nên thuê người viết thì sẽ nhanh hơn nhé.