Thêm thông tin mở rộng cho sản phẩm WooCommerce

Cập nhật lần cuối vào

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.

Thêm thuộc tính cho sản phẩm

Đố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:

Thêm giá trị cho thuộc tính

Thêm giá trị cho thuộc tính sản phẩm

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.

Danh sách thuộc tính 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.

Chọn thuộc tính cho sản phẩm

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.

Chọn tất cả các thuộc tính cho sản phẩm

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.

Nhập giá trị cho thuộc tính sản phẩm

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.

Nhập thuộc tính giảm giá cho sản phẩm

Xem sản phẩm để thấy kết quả ngoài Frontend của quá trình thực hiện.

Kết quả tạo thuộc tính cho sản phẩm

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.

Chọn thuộc tính cho sản phẩm trước khi thêm vào giỏ 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!

Theo dõi
Thông báo của
guest

60 Comments
Cũ nhất
Mới nhất Được bỏ phiếu nhiều nhất
Phản hồi nội tuyến
Xem tất cả bình luận
Lee Hung
Lee Hung
9 năm trước

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

Lại Đình Cường
Admin
9 năm trước
Trả lời  Lee Hung

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.

Chi THIen
Chi THIen
8 năm trước

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….

Lại Đình Cường
Admin
8 năm trước
Trả lời  Chi THIen

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.

Nguyễn Chỉnh
Nguyễn Chỉnh
8 năm trước

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

trùm bán dép
trùm bán dép
8 năm trước
Trả lời  Nguyễn Chỉnh

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

Lại Đình Cường
Admin
8 năm trước
Trả lời  trùm bán dép

Cảm ơn bạn đã chia sẻ cùng mọi người.

Thuận
Thuận
8 năm trước

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.

Lại Đình Cường
Admin
8 năm trước
Trả lời  Thuậ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.

Nguyễn Văn nghĩa
Nguyễn Văn nghĩa
8 năm trước

cho e hỏi làm sao để hiển thị chữ Sale ở góc trái đó ạ

Lại Đình Cường
Admin
8 năm trước

Cái đó mặc định WooCommerce đã hỗ trợ rồi mà bạn? Hay là bạn dùng template tự viết?

Phạm Hoài Nam
Phạm Hoài Nam
8 năm trước

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.

Lại Đình Cường
Admin
8 năm trước
Trả lời  Phạm Hoài Nam

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

Phạm Hoài Nam
Phạm Hoài Nam
8 năm trước

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 @@

Lại Đình Cường
Admin
8 năm trước
Trả lời  Phạm Hoài Nam

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]

Phạm Hoài Nam
Phạm Hoài Nam
8 năm trước

ah! ok tks bạn nhiều 🙂

Phạm Hoài Nam
Phạm Hoài Nam
8 năm trước

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 ! 🙂

Lại Đình Cường
Admin
8 năm trước
Trả lời  Phạm Hoài Nam

Đâ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.

Phạm Hoài Nam
Phạm Hoài Nam
8 năm trước

=)) 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 🙂

tranhahai
tranhahai
8 năm trước

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 ?

Nguyễn Mạnh Hùng
Nguyễn Mạnh Hùng
8 năm trước

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

Lại Đình Cường
Admin
8 năm trước

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.

Hà Huy Dũng
8 năm trướ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 akcomment image

triệu dũng
triệu dũng
8 năm trước

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

thiết kế nhà phố
8 năm trước

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 🙂

Trần Cao Tài
Trần Cao Tài
8 năm trước

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

Lại Đình Cường
Admin
8 năm trước
Trả lời  Trần Cao Tài

Bạn thay đổi chữ Add to cart tại đây nhé:

https://docs.woothemes.com/document/change-add-to-cart-button-text/

Anh Hải
Anh Hải
7 năm trước

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 ?

Lại Đình Cường
Admin
7 năm trước
Trả lời  Anh Hải

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]

leemindinh
leemindinh
7 năm trước

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!

Lại Đình Cường
Admin
7 năm trước
Trả lời  leemindinh

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

phùng thị quỳnh
phùng thị quỳnh
7 năm trước

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

Lại Đình Cường
Admin
7 năm trước

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.

Nệm Sài Gòn
Nệm Sài Gòn
7 năm trước

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.

Azhost
6 năm trước

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!!!

Lại Đình Cường
Admin
6 năm trước
Trả lời  Azhost

Để 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 »

Kim
6 năm trước

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 »

Axtai
6 năm trước

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?

Lại Đình Cường
Admin
6 năm trước
Trả lời  Axtai

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é.

Axtai
6 năm trước

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 ạ?

than thoai
6 năm trước

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%

Lại Đình Cường
Admin
6 năm trước
Trả lời  than thoai

Bạn thử dùng plugin WooCommerce Bulk Discount thử nhé: https://wordpress.org/plugins/woocommerce-bulk-discount/

Thắng
Thắng
6 năm trước

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

Lại Đình Cường
Admin
6 năm trước
Trả lời  Thắng

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é.

variable_product_attributes

Thắng
Thắng
6 năm trước

Ok để mình xoay thử. Tks ad

Lại Đình Cường
Admin
6 năm trước
Trả lời  Thắng

Khi nào tìm ra nguyên nhân nhớ chia sẻ cùng mọi người nha bạn 🙂

Thắng
Thắng
5 năm trước
Trả lời  Thắng

Cái này do lỗi theme không tương thích với woocommerce. Thay theme (template) khác là được

ninh
5 năm trướ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

Lại Đình Cường
Admin
5 năm trước
Trả lời  ninh

Ý 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é.

Havit
5 năm trước

Thank bạn. Đúng cái mình cần tìm

Đăng
Đăng
5 năm trước

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

Thanh
Thanh
5 năm trước

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 »

Lại Đình Cường
Admin
5 năm trước
Trả lời  Thanh

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.

Thanh
Thanh
5 năm trước

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….

Thanh
Thanh
5 năm trước

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

máy lọc nước nóng lạnh

cảm ơn bạn đã chia sẻ

Duy
Duy
2 năm trước

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 ạ ?

Lại Đình Cường
Admin
2 năm trước
Trả lời  Duy

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?

Duy
Duy
2 năm trước

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 ạ.

Lại Đình Cường
Admin
2 năm trước
Trả lời  Duy

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é.