Hi các bạn! Tiếp tục với seri về hướng dẫn lập trình theme WooCommerce thì hôm nay mình sẽ hướng dẫn cho các bạn chức năng hiển thị các sản phẩm trong giỏ hàng.

Cụ thể bài này mình sẽ hướng dẫn hiển thị, xóa 1 sản phẩm ra khỏi giỏ hàng và các chức năng linh tinh khác.

Hướng dẫn hiển thị sản phẩm trong giỏ hàng WooCommerce

Chức năng này nè

Hiển thị sản phẩm trong giỏ hàng WooCommerce

Để dễ hình dung thì mình sẽ show code trước sau đó giải thích để cho các bạn dễ theo dõi, bạn thích nó hiển thị ở đâu thì copy đoạn code này dán vào chổ trong theme đang sử dụng nha.

Chúng ta có đoạn code như sau:

Giải thích một tí nhé:

  • <?php global $woocommerce; ?> khai báo biến toàn cục, biến này được cung cấp bởi woo nha
  • <?php $items = $woocommerce->cart->get_cart();?> get danh sách các sản phẩm có trong giỏ hàng, giá trị $items này trả về sẽ là 1 mảng chứa nhiều phần tử là các sản phẩm có trong giỏ hàng.
  • <?php $cart_item_remove_url = wc_get_cart_remove_url($key); ?> Khai báo link xóa sản phẩm ra khỏi giỏ hàng
  • Mình kiểm tra $items có phần tử thì chạy vòng lặp rồi in nó ra nha, nếu không có thì show ra dòng chữ “không có sản phẩm nào đã được thêm vào giỏ hàng” nha!

Giải thích dài dòng thế thôi chứ nều không biết các bạn cứ copy dòng code kia rồi sử dụng không cần quan tâm gì hết nha!

Sử dụng cách khác:

Ngoài cách trên sử dụng code, chúng ta còn có cách sử dụng widget. Mặc định khi cải plugin woocommerce thì nó cũng đã cung cấp cho chúng ta một wiget để lấy thông tin giỏ hàng.

Các bạn vào: Admin -> giao diện -> widget sẽ thấy cơ wiget tên là: Giỏ hàng

Bạn có thể sử dụng widet này và cho kết quả tương tự, để tìm hiểu cách sử dụng và đặt vị trí sử dụng widget các bạn xem bài viết về get sidebar này nha.

Tổng kết:

Hôm nay mình đã hướng dẫn cho các bạn cách làm chức năng giỏ hảng mini. Hy vọng với chút kiến thức này sẽ giúp 1 phần cho các bạn học wordpress dễ dàng hơn.

Đừng quên like page và theo dõi các bài viết tiếp theo của mình nha!

Huy Kira

Đam mê hóa học, ưng thi vào trường kinh tế... Đậu vào trường Sư phạm, quyết tâm đi dạy... Ra trường đi làm designer, tự học frontend, chuyển qua làm PHP, được công ty đào tạo laravel... Và hiện tại đang code react native(2015) => Fullstack ... ?? tối về viết blog... (Còn tiếp...)

7
AVT