Rút gọn tiêu đề, mô tả ngắn của sản phẩm trong Woocomerce

Đôi khi chúng ta đặt tên sản phẩm quá dài dẫn đến giao diện trông xộc xệch, không đẹp mắt. Để giải quyết vấn đề này, chúng ta hãy rút gọn tên sản phẩm trong Woocomerce bằng đoạn code dưới dây.

Rút gọn tiêu đề, mô tả ngắn của sản phẩm trong Woocomerce

CSS rút gọn tiêu đề

/* Rút gọn tiêu đề thành 2 hàng, còn thừa là …
* Thay class tại vị trí cần thay
* Thêm đoạn CSS vào CSS tùy chỉnh
*/
.class {
text-overflow: ellipsis;
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}

Còn một cách khách thêm code bên dưới vào file function.php của theme/child theme đang kích hoạt

add_filter( ‘the_title’, ‘short_title_product’, 10, 2 );
function short_title_product( $title, $id ) {
if (get_post_type( $id ) === ‘product’ & !is_single() ) {
return wp_trim_words( $title, 7 ); // thay đổi số từ bạn muốn thêm
} else {
return $title;
}
}

Code rút gọn mô tả ngắn

add_filter( ‘the_title’, ‘shorten_post_title’, 10, 2 );
function shorten_post_title( $title, $id ) {
if (get_post_type( $id ) === ‘post’ & !is_single() ) {
return wp_trim_words( $title, 14 ); // thay đổi số từ bạn muốn hiển thị
} else {
return $title;
}
}

Chúc các bạn thành công nhé!