Hiển thị sản phẩm nổi bật trong Woocommerce
Nếu như bạn đang tự làm theme bán hàng từ Woocommerce hay muốn chỉnh sửa giao diện website theo ý mình thì nắm được 1 số hàm cơ bản của Woocommerce là rất cần thiết.Sau đây Sơn Web sẽ hướng dẫn bạn cách hiện thị sản phẩm nổi bật của plugin Woocommerce mới nhất từ version 3.0 trở lên.
Hiển thị sản phẩm nổi bật Woocommerce từ shortcode
Hiển thị sản phẩm nổi bật trong Woocommerce
Mặc định Woocommerce đã tích hợp sẵn shortcode để bạn có thể dùng hiển thị bất kỳ đâu.
[featured_products per_page=”12″ columns=”4″]
Đây là shortcode sẵn từ Woocommerce mà bạn có thể sử dụng, tuy nhiên khi bạn sử dụng shortcode của Woocommerce thì 1 số định dạng css sẵn của plugin cũng được tích hợp sẵn.Do đó nếu muốn hiển thị sản phẩm theo ý bạn thì bạn có thể sử dụng query mà WordPress hỗ trợ.
Hiển thị sản phẩm nổi bật dùng code
Hiển thị sản phẩm nổi bật với Woocommerce 3.0
Woocommerce version 3.0 có sự thay đổi nhỏ về database , đối số truyền vào khi truy vấn về hiển thị sản phẩm nổi bật có chút thay đổi.Đây là ví dụ
Hiển thị sản phẩm nổi bật trong Woocommerce
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 |
<ul class="woo products"> <li style="list-style-type: none;"> <ul class="woo products"><!--?php $args = array( 'post_type' => 'product',<br ?--> 'posts_per_page' => 12,</ul> </li> </ul> <ul class="woo products"> <li style="list-style-type: none;"> <ul class="woo products">'tax_query' => array(</ul> </li> </ul> <ul class="woo products"> <li style="list-style-type: none;"> <ul class="woo products">array(</ul> </li> </ul> <ul class="woo products"> <li style="list-style-type: none;"> <ul class="woo products">'taxonomy' => 'product_visibility',</ul> </li> </ul> <ul class="woo products"> <li style="list-style-type: none;"> <ul class="woo products">'field' => 'name',</ul> </li> </ul> <ul class="woo products"> <li style="list-style-type: none;"> <ul class="woo products">'terms' => 'featured',</ul> </li> </ul> <ul class="woo products"> <li style="list-style-type: none;"> <ul class="woo products">),</ul> </li> </ul> <ul class="woo products"> <li style="list-style-type: none;"> <ul class="woo products">),</ul> </li> </ul> <ul class="woo products"> <li style="list-style-type: none;"> <ul class="woo products">);</ul> </li> </ul> <ul class="woo products"> <li style="list-style-type: none;"> <ul class="woo products">$loop = new WP_Query( $args );</ul> </li> </ul> <ul class="woo products"> <li style="list-style-type: none;"> <ul class="woo products">if ( $loop->have_posts() ) {</ul> </li> </ul> <ul class="woo products"> <li style="list-style-type: none;"> <ul class="woo products">while ( $loop->have_posts() ) : $loop->the_post();</ul> </li> </ul> <ul class="woo products"> <li style="list-style-type: none;"> <ul class="woo products">wc_get_template_part( 'content', 'product' );</ul> </li> </ul> <ul class="woo products"> <li style="list-style-type: none;"> <ul class="woo products">endwhile;</ul> </li> </ul> <ul class="woo products"> <li style="list-style-type: none;"> <ul class="woo products">} else {</ul> </li> </ul> <ul class="woo products"> <li style="list-style-type: none;"> <ul class="woo products">echo __( 'No products found' );</ul> </li> </ul> <ul class="woo products"> <li style="list-style-type: none;"> <ul class="woo products">}</ul> </li> </ul> <ul class="woo products"> <li style="list-style-type: none;"> <ul class="woo products">wp_reset_postdata();</ul> </li> </ul> <ul class="woo products">?></ul> |
Hiển thị sản phẩm nổi bật với Woocommerce 2.0
Đối với version 2.0 trước đây bạn chỉ cần truy vấn theo 2 tham số meta_key,meta_value
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 |
<ul class="woo products"> <li style="list-style-type: none;"> <ul class="woo products"><!--?php $args = array( 'post_type' => 'product',<br ?--> 'posts_per_page' => 12,</ul> </li> </ul> <ul class="woo products"> <li style="list-style-type: none;"> <ul class="woo products">'meta_key' => '_featured',</ul> </li> </ul> <ul class="woo products"> <li style="list-style-type: none;"> <ul class="woo products">'meta_value' => 'yes',</ul> </li> </ul> <ul class="woo products"> <li style="list-style-type: none;"> <ul class="woo products">);</ul> </li> </ul> <ul class="woo products"> <li style="list-style-type: none;"> <ul class="woo products">$loop = new WP_Query( $args );</ul> </li> </ul> <ul class="woo products"> <li style="list-style-type: none;"> <ul class="woo products">if ( $loop->have_posts() ) {</ul> </li> </ul> <ul class="woo products"> <li style="list-style-type: none;"> <ul class="woo products">while ( $loop->have_posts() ) : $loop->the_post();</ul> </li> </ul> <ul class="woo products"> <li style="list-style-type: none;"> <ul class="woo products">wc_get_template_part( 'content', 'product' );</ul> </li> </ul> <ul class="woo products"> <li style="list-style-type: none;"> <ul class="woo products">endwhile;</ul> </li> </ul> <ul class="woo products"> <li style="list-style-type: none;"> <ul class="woo products">} else {</ul> </li> </ul> <ul class="woo products"> <li style="list-style-type: none;"> <ul class="woo products">echo __( 'No products found' );</ul> </li> </ul> <ul class="woo products"> <li style="list-style-type: none;"> <ul class="woo products">}</ul> </li> </ul> <ul class="woo products"> <li style="list-style-type: none;"> <ul class="woo products">wp_reset_postdata();</ul> </li> </ul> <ul class="woo products">?></ul> |
Trả lời