Home » » Tạo Auto Readmore với Cutter.js cho Blogger


Cutter.js giúp ta giữ lại được mô tả gốc với các thẻ HTML như in đậm, in nghiêng, màu chữ... 


☼ Các bước thực hiện thủ thuật :
1. Vào bố cục
2. Vào chỉnh sửa HTML
3. Chọn mở rộng mẫu rồi chèn đoạn sau phía trên </head> 
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<style type='text/css'>
.post-body img { display:block; float:left; margin-right: 10px; width:100px; height:100px }
</style>
<script src='http://dl.dropbox.com/u/70549761/jQuery/namkna-blogspot-com/cutter.js'/>
</b:if>
Trong đó: 
  • width:100px: là chiều rộng ảnh đại diện
  • height:100px là chiều cao của ảnh đại diện
Tiếp tục tìm đến đoạn <data:post.body/> và thay thế nó bằng đoạn sau:
<div class='post-body'>
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<span expr:id='data:post.id'><data:post.body/></span>
<script type='text/javascript'>
var snippet = document.getElementById(&quot;<data:post.id/>&quot;);
Cutter.run(snippet, snippet, 40);
</script>
<b:else/><data:post.body/></b:if>
<div class='clear'/>
<b:if cond='data:post.hasJumpLink'>
<a class='jump-link' expr:href='data:post.url + &quot;#more&quot;'>Read More</a><b:else/>
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<a class='jump-link' expr:href='data:post.url' rel='nofollow'>Read More</a>
</b:if></b:if>
</div>
Thay snippet, 40 thành số ký tự mô tả muốn hiển thị
Lưu ý:  Cutter.js sẽ lấy 40 kí tự đầu tiên trong bài đăng để hiển thị ra trang chủ do vậy nên nếu không có ảnh nào được chèn giữa 40 kí tự này thì sẽ không có ảnh thumbnail, bạn cần lưu ý điều này và nên đặt một tấm ảnh lên trên cùng của bài đăng để làm ảnh đại diện ở trang chủ.

Tags:

0 nhận xét to "Tạo Auto Readmore với Cutter.js cho Blogger"

Leave a comment

Top Stories

Info Nggladrah

Total Pageviews

Affiliates

Sport Video

Thời tiết và tỉ giá

QC

Footer Widget 1

Template information

Iklan

Test Footer 2

Được tạo bởi Blogger.

Search

Xem nhiều nhất