Người Viết : ViKiMi Editor

Thực hiện di chuyển Product meta vào Description Tab, hiệu quả trong thiết kế Product Page
Tuỳ chỉnh thông tin hiển thị với Trang Sản Phẩm của WooCommerce, có rất nhiều tính năng chúng ta có thể xử lý. Việc tạo ra các hiển thị đẹp mắt rất tốt, đặc biệt khi có thiết kế Product Tabs hoàn hảo chúng ta sẽ yên tâm về chất lượng mà chúng ta mang lại. Mục đích đem lại sự tiện ích lớn nhất cho khách hàng tiềm năng tham gia mua sắm.
Trong phần này chúng ta sẽ thực hiện một tuỳ chỉnh đơn giản.
+ Công việc đó là đưa phần Product Meta tới phần Tab mô tả sản phẩm.
Mục đích chúng ta sẽ có thể cung cấp một hiển thị mới. Khi khách hàng chọn xem nội dung mô tả sản phẩm (Description Tab) thì chúng ta cũng sẽ cung cấp cho khách hàng những thông tin Product Meta một cách hợp lý.
(Đối với những tuỳ chỉnh có mục đích tương tự, chúng ta sẽ cũng có cách làm tương tự để hiển thị nhiều hơn các thông tin hữu ích của sản phẩm. Những tuỳ chỉnh tạo ra những thiết kế đẹp mắt luôn đem lại chất lượng khi chúng ta làm chủ được hệ thống thương mại điện tử WooCommerce)
CHÚNG TA THỰC HIỆN NHỮNG BƯỚC SAU :
BƯỚC 1 : Bước này bạn có thể thực hiện nếu bạn muốn xoá hiển thị mặc định Product Meta của WooCommerce. Nếu bạn không cần xoá thì vẫn có thể để như mặc định.
remove_action( ‘woocommerce_single_product_summary’, ‘woocommerce_template_single_meta’, 40 );
BƯỚC 2 : Thực hiện đưa phần Product Meta tới Tab mô tả sản phẩm (Description Tab) tại Trang sản phẩm
Thiết kế này sẽ giúp phần Description Tab nổi bật hơn, và cung cấp thêm Product Meta tới khách hàng.
add_filter( ‘woocommerce_product_tabs’, ‘shop_custom_product_tabs’, 999 );
function shop_custom_product_tabs( $tabs ) {
/* Thực hiện ghi đè Callback Function
* We overwrite the callback function with a custom one
*/
$tabs[‘description’][‘callback’] = ‘shop_product_meta_and_description_tab’;
/* Thực hiện tạo cho Title của Tab
* (Optional) We can also overwrite the title
*/
$tabs[‘description’][‘title’] = __(‘Meta and description’, ‘woocommerce’);
return $tabs;
}
function shop_product_meta_and_description_tab() {
/*
* Tạo hiển thị mới cho Description Tab bằng cách gọi các Template
*/
wc_get_template( ‘single-product/meta.php’ );
wc_get_template( ‘single-product/tabs/description.php’ );
/* the_content(); Hoặc sử dụng Function này */
}
Như vậy, chúng ta sẽ có một trong những thiết kế rất đơn giản và gọn nhẹ để có thể show các thông tin sản phẩm phù hợp nhất đến khách hàng. Tất nhiên, đây cũng như một mẫu cơ bản có thể vận dụng. Nếu muốn có những mẫu hiển thị cơ bản tương tự thì chúng ta vẫn có thể tạo ra những đoạn mã tuỳ chỉnh phù hợp, cần thiết.
Lưu ý : Bạn có thể thực hiện những mã tuỳ chỉnh tại Function.php của Child Theme để đảm bảo rằng bạn sẽ không phải lo lắng về Code bị xoá khi cập nhật Theme. Child Theme sẽ đáp ứng cho bạn những thứ cần thiết & đảm bảo Code luôn không bị ảnh hưởng do cập nhật Theme.