Để chỉnh sửa lại template của WooCommerce, việc đầu tiên là các bạn cần tạo thư mục woocommerce (wp-content/themes/[theme-cua-ban]/woocommerce) sau đó copy tất cả các file thư mực plugin/woocommerce/templates qua. Việc này sẽ giúp các bạn chỉnh sửa có sai hoặc nhầm chỗ nào thì còn có file dự phòng hoặc khi woocommerce có phiên bản mới cần update thì cũng không ảnh hưởng đến theme chúng ta đã chỉnh sửa, nếu không update woocommerce sẽ mất hết những gì đã sửa. Giả sử bạn muốn sửa trang shop, các bạn sửa trong file archive-product.php. Bạn sẽ thấy mặc định nó gọi 1 sidebar bằng cách gọi action do_action( 'woocommerce_sidebar' ); và mặc định action này sẽ gọi file /woocommerce/shop/sidebar.php Bạn có thể định nghĩa thêm 1 sidebar nữa ở trong file này, hoặc hook vào action này để gọi thêm sidebar khác.. Sau đây là một số code hay để chỉnh sửa trang shop Woocommerce: Code đổi tên nút Add to cart Trong bản dịch woocommerce cũng đã đổi nút Add to cart thành nút thêm vào giỏ hàng, nhưng bạn muốn nhiều hơn thế, bạn muốn đổi tên nó thành cái khác ví dụ như mua ngay. Mình chia sẻ bạn đoạn code hay cho woocommerce giúp bạn làm được việc đó. Mã: // Đổi nút Add to cart trong trang sản phẩm add_filter('woocommerce_product_single_add_to_cart_text','woo_custom_cart_button_text');// 2.1 + functionwoo_custom_cart_button_text(){ return__('My Button Text','woocommerce'); } // Đổi nút Add to cart trong phần danh mục sản phẩm add_filter('woocommerce_product_add_to_cart_text','woo_archive_custom_cart_button_text');// 2.1 + functionwoo_archive_custom_cart_button_text(){ return__('My Button Text','woocommerce'); } // Đổi nút Add to cart theo từng loại sản phẩm add_filter('woocommerce_product_add_to_cart_text','custom_woocommerce_product_add_to_cart_text'); /** * custom_woocommerce_template_loop_add_to_cart */ functioncustom_woocommerce_product_add_to_cart_text(){ global$product; $product_type=$product->product_type; switch($product_type){ case'external': return__('Buy product','woocommerce');//Nút mua ngay sản phẩm break; case'grouped': return__('View products','woocommerce');//Mua 1 nhóm sản phẩm break; case'simple': return__('Add to cart','woocommerce');// Đơn lẻ 1 sản phẩm thuần break; case'variable': return__('Select options','woocommerce');// 1 sản phẩm nhưng có nhiều tùy chọn break; default: return__('Read more','woocommerce');// Xem chi tiết sản phẩm } } Những cái này tùy trường hợp mà áp dụng nhé. Code xóa hẳn nút add to cart Bạn chỉ muốn đăng sản phẩm dạng trưng bày, bạn không cần tính năng đặt hàng hay mua hàng trực tuyến. Hãy sử dụng code hay cho woocommerce sau. Nó sẽ xóa hẳn cái nút Add to cart đi. Mã: /* Code xoa nut Add to cart */ functionremove_loop_button(){ remove_action('woocommerce_after_shop_loop_item','woocommerce_template_loop_add_to_cart',10); remove_action('woocommerce_single_product_summary','woocommerce_template_single_add_to_cart',30); } add_action('init','remove_loop_button'); Code chuyển hướng nút Add to cart đến 1 trang nào đó Thay vì nhấn nút Add to cart là thêm vào giỏ hàng, nhưng sản phẩm của bạn không có giá cố định, bạn muốn chuyển nút Add to cart thành nút Liên hệ đặt hàng chẳng hạn. Phải làm thế nào? Đầu tiên là bạn đổi tên cái nút Add to cart thành chữ Liên hệ đặt hàng (đã có code bên trên). Sau đó tạo 1 trang Liên hệ đặt hàng, chèn cái contact form (tự làm cái này nhé) vào đó. Cuối cùng dùng code bên dưới để chuyển hướng cái nút Add to cart đến cái trang liên hệ đó Mã: /* Code chuyen huong khi click vao nut add to cart */ functioncustom_add_to_cart_redirect(){ return'http://www.yourdomain.com/your-page/';//Thay link cái trang liên hệ vào đây } add_filter('woocommerce_add_to_cart_redirect','custom_add_to_cart_redirect'); Hoặc bạn muốn khi nhấn nút Add to cart xong nó sẽ chuyển ngay đến trang Thanh toán chứ không phải là chuyển đến giỏ hàng. Hãy dùng code hay cho woocommerce bên dưới Mã: /* Code chuyển hướng đến trang thanh toán ngay khi ấn Add to cart */ add_filter('woocommerce_add_to_cart_redirect','wc_custom_cart_redirect'); functionwc_custom_cart_redirect(){ return'/thanh-toan/';// thay cái link trang thanh toán vào đây } Biến nút Add to cart thành nút xem chi tiết sản phẩm Cái này nó có 2 bước. Bước 1: Xóa nút Add to cart trên trang danh mục sản phẩm Mã: /*STEP 1 - REMOVE ADD TO CART BUTTON ON PRODUCT ARCHIVE (SHOP) */ functionremove_loop_button(){ remove_action('woocommerce_after_shop_loop_item','woocommerce_template_loop_add_to_cart',10); } add_action('init','remove_loop_button'); Bước 2: Thêm một cái nút mới dẫn đến đường link của sản phẩm Mã: /*STEP 2 -ADD NEW BUTTON THAT LINKS TO PRODUCT PAGE FOR EACH PRODUCT */ add_action('woocommerce_after_shop_loop_item','replace_add_to_cart'); functionreplace_add_to_cart(){ global$product; $link=$product->get_permalink(); echo do_shortcode('<a href="'.$link.'">Xem chi tiết</a>'); } Vậy là xong. Code set ảnh mặc định cho sản phẩm Khi bạn không đăng ảnh feature image cho sản phẩm, khi sản phẩm chưa có ảnh đại diện thì nó sẽ lấy ảnh này làm ảnh đại diện mặc định (Giống như rao vặt bên chotot.com) Mã: add_action('init','custom_fix_thumbnail'); functioncustom_fix_thumbnail(){ add_filter('woocommerce_placeholder_img_src','custom_woocommerce_placeholder_img_src'); functioncustom_woocommerce_placeholder_img_src($src){ $upload_dir=wp_upload_dir(); $uploads=untrailingslashit($upload_dir['baseurl']); $src=$uploads.'/2012/07/thumb1.jpg';// Thay link ảnh chỗ này return$src; } } Biến sản phẩm 0 đ thành Liên hệ Mã: /* 0đ thành Liên Hệ */ add_filter('woocommerce_variable_free_price_html','hide_free_price_notice'); add_filter('woocommerce_free_price_html', 'hide_free_price_notice'); add_filter('woocommerce_variation_free_price_html','hide_free_price_notice'); /** * Hides the 'Free!' price notice */ functionhide_free_price_notice($price){ return'Liên hệ'; } Code hiển thị số tiền được giảm giá Mã: add_filter('woocommerce_sale_price_html','woocommerce_custom_sales_price',10,2); functionwoocommerce_custom_sales_price($price,$product){ $percentage=round((($product->regular_price-$product->sale_price)/$product->regular_price)*100); return$price.sprintf(__(' <span class="price_save">Save %s</span>','woocommerce'),$percentage. '%'); } Ẩn các phương thức giao hàng khi sử dụng phương thức Miễn phí giao hàng Mã: /** * Hide shipping rates when free shipping is available. * Updated to support WooCommerce 2.6 Shipping Zones. * * @param array $rates Array of rates found for the package. * @return array */ functionmy_hide_shipping_when_free_is_available($rates){ $free=array(); foreach($rates as$rate_id=>$rate){ if('free_shipping'===$rate->method_id){ $free[$rate_id]=$rate; break; } } return!empty($free)?$free:$rates; } add_filter('woocommerce_package_rates','my_hide_shipping_when_free_is_available',100); VPS tốt nhất dành cho Wordpress: Vultr hoặc DigitalOcean
