Hiển thị các thuộc tính sản phẩm trong Woocommerce lên themes WordPress

Thuộc tính sản phẩm là một phần trong Product data của Woocommerce, là một tính năng giúp lưu trữ và hiển thị các thuộc tính sản phẩm. Nếu bạn sử dụng các themes mua sẵn thì có thể không cần đọc bài viết này vì bài này mình viết hướng dẫn việc lấy danh sách các thuộc tính sản phẩm trong Woocommerce dành cho themes tự viết.

Tạo và sử dụng thuộc tính sản phẩm trong Woocommerce

Thông thường bạn có thể tạo các thuộc tính sản phẩm ngay trong phần product data của sản phẩm. Tuy nhiên cách làm này sẽ không thống nhất và có thể gây khó khăn khi quản lý hiển thị. Lời khuyên của mình là bạn hãy tạo ở phẩn thuộc tính sản phẩm.

• Để thêm thuộc tính sản phẩm bạn vào phần sản phẩm > Các thuộc tính và thêm các thuộc tính vào đây.

• Bây giờ bạn vào phần sản phẩm bạn có thể thêm các thuộc tính sản phẩm vào.

Như vậy là các sản phẩm đã có thuộc tính, bây giờ mình sẽ cho các thuộc tính này hiển thị trong theme phần sản phẩm của Woocommerce.

Hiển thị các thuộc tính sản phẩm trong Woocommerce

Bây giờ mình sẽ mở file “content-single-product.php” và thêm đoạn này vào phần bạn muốn hiển thị sản phẩm.

<?php
  $attributes = $product->get_attributes();
  echo "<table class=\"table table-bordered\">";
  $headtitle;
  $values;
  foreach ( $attributes as $attribute ) {
      $headtitle .= "<th>".get_taxonomy($attribute[ 'name' ])->labels->singular_name."</th>";
      $values .= "<td>".array_shift( wc_get_product_terms( $product->id, $attribute[ 'name' ] ) )."</td>";
  } 
  echo "<tr>".$headtitle."</tr>";
  echo "<tr>".$values."</tr>";
  echo "</table>"; 
?>

Đoạn code trên mình cho hiển thị ra một bảng, bạn có thể tùy chỉnh lại nhé. Mình sẽ giải thích qua đoạn trên một tí.

• $attributes: Biến này sẽ là một mảng lưu những thuộc tính sản phẩm.
• Đoạn các đoạn echo sẽ in ra các giá trị HTML. Mình sẽ không giải thích thêm về chúng.
• $headtitle: sẽ là biến lưu các nhãn(label) của thuộc tính, lưu ý là nó được lồng thẻ <th> và được nối sau mỗi vòng lặp nhé.
• $values: tương tự thẻ $headtitle nhưng nó sẽ lưu trữ giá trị của thuộc tính.
• foreach: là vòng lặp để lặp và lấy từng giá trị trong mảng $attributes và gán vào 2 biến trên.
• Cuối cùng là echo các biến lồng vào các thẻ để phù hợp.

Kết quả hiển thị

Chúc bạn thành công !