(danghienIT) - Theo yêu cầu của Anh Trường (http://vietnewsblog.blogspot.com/) và bạn Hà (http://nganling.blogspot.com/). Hôm nay mình xin được post lại thủ thuật Tạo 'Read More' (đọc tiếp) một cách tự động ver 2.0 (hỗ trợ thumbnail ảnh) của anh Vo. Trong đó mình đã sửa lỗi host của file Java Scrip.
Nếu bạn muốn tạo các link Read More (đọc tiếp) của mình 1 cách tự động mà không cần phải thủ công dùng các thẻ span (class=fullpost) để ngăn phần miêu tả và phần post đầy đủ. Nó cũng giúp cho các blog trước đây không có read more có thể chủ động tạo link mà không cần phải sửa lại toàn bộ các bài viết.
Với bản 1.0, bạn chỉ có thể tạo readmore tự động không có hình đại diện, với bản 2.0 này, có hỗ trợ hình đại diện, nó sẽ lấy ảnh đầu tiên trong bài viết làm ảnh đại diện.
Cài đặt:
Chú ý: với các blog đang sử dụng phiên bản read more 1.0 thì hãy gỡ bỏ code đó ra nhé, nếu bạn không biết cách gỡ thì hãy đọc lại bài hướng dẫn ở đây để truy ra code của nó mà xóa cho đúng
Vào Template - Edit HTML, Expand widget, tìm đến thẻ <data:post.body/> và thay nó bằng đoạn code sau:
<b:if cond='data:blog.pageType != "item"'>
<div expr:id='"summary" + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script>
<span class='rmlink' style='float:right'><a expr:href='data:post.url'>-->đọc tiếp...</a></span>
</b:if>
<b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>
Ngoài ra bạn còn phải cho đoạn code dưới đây vào phần HEAD (<head> ... </head>) của template:
<script type='text/javascript'>
summary_noimg = 430;
summary_img = 340;
img_thumb_height = 100;
img_thumb_width = 120;
</script>
<script src='http://www.hotlinkfiles.com/files/2674491_jd5hj/danghienit_readmore2.0.js]danghienit_readmore2.0.js' type='text/javascript'/>
Các bạn hãy chú ý các thông số màu đỏ mà tôi đã đánh dấu:
summary_noimg là số ký tự phần miêu tả cho các bài không có hình đại diện.
summary_img là số ký tự phần miêu tả cho các bài có hình đại diện.
img_thumb_height chiều cao của hình đại diện (pixel).
img_thumb_width chiều rộng của hình đại diện (pixel).
Hình dưới đây là ví dụ về hiển thị của read more tự động sau khi cài đặt:
Chúc các bạn vui vẻ, nhất là những bạn bấy lâu nay "trông chờ" phiên bản này!
(Theo Vietwebguide)
Đang tải xin vui lòng chờ...
3 comments:
he đại ca.Version moi nhat cua read more da la 4.1 rui day.Sao lai dang lai ver 2.0 nua troi.
P/s:Anh dung file js tren host anh dung luon ha.Chiu choi nha.Lo het bandwith mot cai thi...o...e ngay....
@Trần Đình Nguyện: Theo mình nghĩ phiên bản 2.0 là dùng được rồi. Nếu muốn mình sẽ cập nhập lại bài viết sau. Còn về host thì bạn cứ yên tâm nhé! Banwith của host mình mới có 20% thôi. Các bạn có thể download file JS về và upload lên host riêng có thể load nhanh hơn!
Sau khi đọc bài viết này của tác giả danghienit, tôi đã làm được cái readmore như ý.
Chân thành cảm ơn Hiển.
Các bạn có thể vô trang blog mới của mình xem thử nhé.
http://obamavn-tmt.blogspot.com
Post a Comment
[▼/▲] Chèn biểu tượng vui