Những lưu ý khi lập trình theme cho Woocommerce 3+

Từ version Woo 3+ đã có một ít thay đổi khi bạn lập trình theme tương thích với woocommerce dành cho website bán hàng so với Woo version nhỏ hơn trước đây. Sau đây Sơn Web sẽ tổng hợp và chia sẻ cùng bạn,

Thêm code khai báo theme sử dụng Woocommerce

Nếu như trước đây bạn chỉ việc copy các file trong thư mục plugin woocommerce vào trong thư mục theme bạn để ghi đè, hay viết các file , hook,filer,action của Woo mà website vẫn tương thích chạy phà phà, thì ở version >3, bạn phải khai báo thì Woocommerce mới chạy trơn tru được,Sau đây là code khi báo theme bạn với Woocommerce.trong file function.php

add_action( 'after_setup_theme', 'woocommerce_support' );
function woocommerce_support() {
   add_theme_support( 'woocommerce' );
}

Bạn nên khai báo dòng code trên khi bắt đầu viết các hook, action cho theme.

Hiển thị lightbox,Image zoom sản phẩm trong single product

Ở version > 3.0 của Woo mặc định sẽ không hỗ trợ chức năng lightbox,hay gallery product.Do đó nếu bạn muốn hiển thị mặc định như version cũ trước đây, bạn sẽ cần khai báo thêm dòng code vào file function.php .

add_theme_support( 'wc-product-gallery-zoom' );
add_theme_support( 'wc-product-gallery-lightbox' );
add_theme_support( 'wc-product-gallery-slider' );

Hiển thị sản phẩm nội bật trong Woocommerce

Nếu như bạn dùng shortcode trong Woocommerce thì rất đơn giản chỉ cần dùng đoạn code sau

Nếu như bạn viết trong loop code thì ở version cũ trước đây dùng trong code sau:

$args = array(  
    'post_type' => 'product',  
    'meta_key' => '_featured',  
    'meta_value' => 'yes',  
    'posts_per_page' => 1  
);  
  
$featured_query = new WP_Query( $args );  
      
if ($featured_query->have_posts()) :   
  
    while ($featured_query->have_posts()) :   
      
        $featured_query->the_post();  
          
        $product = get_product( $featured_query->post->ID );  
          
        // Output product information here  
          
    endwhile;  
      
endif;  
  
wp_reset_query(); // Remember to reset  

Tuy nhiên ở version 3.0 trở lên thì bạn cần sủa lại như sau:

Nêu như code cũ bạn dùng meta_key, meta_value, thì ở version mới bạn dùng tax_query.

Từ Woocommerce >3 đã có nhiều tính năng mới hỗ trợ trải nghiệm người dùng tốt hơn như gallery và tính năng zoom image sản phẩm.Cải thiện hiệu năng thực thi store,hỗ trợ tính năng mới cli cho rest api.