[Tip hay Flatsome]Hướng dẫn cố định dòng tiêu đề sản phẩm khi hiển thị danh sách sản phẩm

[Tip hay Flatsome]Hướng dẫn cố định dòng tiêu đề sản phẩm khi hiển thị danh sách sản phẩm

Cái này thì chắc nhiều bác bị rồi, em trước đây làm cho khách cũng bị càm ràm, cũng hơi bị cáu. Hôm nay em chia sẻ cái mà nhiều bác chắc chắn cũng sẽ bị như em.

Cái này thì không phải dùng riêng cho Flatsome mà nó còn dùng được cho tất cả các website dùng Woocommerce. Vì thuộc tính ông thánh này là của plugin bán hàng Woo mà. Nên các thẻ CSS của nó là như nhau..

Cố định dòng tên tiêu đề sản phẩm WordPress Flatsome
Cố định dòng tên tiêu đề sản phẩm WordPress Flatsome

Không dài dòng nữa. Các bác copy đoạn này vào phần CSS toàn trang và làm theo hướng dẫn dưới đây nếu bác nào chưa biết.

/*Co dinh khoang cach ten sp*/
p.name.product-title a {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
height: 40px; /*tùy theo bạn muốn hiển thị bao nhiêu hàng, như ở đây là 2 hàng tiêu đề như hình*/
}

Còn nếu biết rồi thì không cần đọc đoạn này.

Mục này chỉ hướng dẫn các bác chân ngang hoặc newbie thôi. Túm cái váy lại là chỉ cần hiểu xíu về CSS hoặc hiểu các thuộc tính của nó là quất chết hết mà.

Các bác copy đoạn code trên vào. Làm theo thứ tự:

  • Đăng nhập vào bảng tin. Nhìn menu trong trang admin bên trái. Click vào Giao diện/Tùy biến (Theme/Customize)
  • Đợi nó chuyển trang, sau đó kéo xuống phía dưới cùng. Nhìn thanh menu bên cột trái có chứ CSS. Nhấp vào đó.
  • Dán đoạn này vào.
  • Trường hợp anh em nào đã có đoạn code css từ trước thì cuối đoạn code đã dán từ trước. Anh em nhớ xuống dòng 2 phát rồi dán đoạn code trên vào

Chúc anh em thành công, có vấn đề gì cứ ởi em, comment dưới là được.

Leave a Reply

avatar
  Subscribe  
Notify of
Hotline: 0974.0707.83(Zalo/Viber)