Mình không chuyên về Code, bạn bè gọi mình là “Amatơ”, mình tự làm website Nguyet Kim Online Shopping theo đam mê. Mình mong muốn chia sẻ thật nhiều cùng các bạn

Đoạn Code này được bạn Hoàng Hà trên Facebook chia sẻ. Mình xin phép lưu lại ở đây:

.title-wrapper p.product-title a, .box-excerpt.is-small {
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-flex: 1;
-webkit-box-orient: vertical;
}

Hướng dẫn sử dụng:

  • Thêm vào cuối file style.css
  • Hoặc thêm vào Appearance -> Customize -> Additional CSS paste vô khung textarea là ok

Công dụng:

  1. Định số ký tự hiển thị của tiêu đề sản phẩm 1 dòng
  2. Định số ký tự hiển thị của Nhóm, phận mục sản phẩm 1 dòng
  3. Định số ký tự hiển thị cho mô tả ngắn của sản phẩm 1 dòng,

=> Trang Home của bạn sẽ đẹp hơn rất nhiều, không bị lệch dòng nữa. Không rối mắt nữa

Hình ảnh trang Home:

Home khi chưa chèn code

 

Home khi đã chèn code, gọn nhẹ hơn nhiều, không rối mắt

One thought on “Code làm gọn khung hiển thị sản phẩm trang chủ Woocommecer

Chia sẻ cảm nghĩ của bạn nhé:

%d bloggers like this: