Thứ Năm, 10 tháng 1, 2013

Tự Động Tóm Tắt Bài Viết Có Ảnh Thumbnail Không Dùng Javascript

Các bước thực hiện:
Bước 1: Thêm class post-thumbnail để hiển thị hình ảnh.
Thêm đoạn mã dưới đây vào bên trên thẻ ]]></b:skin>
.post-thumbnail{float:left;margin-right:20px;border:1px solid #005595;border-radius:5px; background:#D2ECF5;width:70px;height:70px;padding:3px}
Trong đó đoạn bôi xanh mình thêm vào cho ảnh thumbnail thêm đẹp.
2. Auto readmore với hình ảnh và hiển thị ảnh mặc định cho bài viết không có ảnh:
Thay thế <data:post.body/> bằng đoạn mã dưới đây:
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<div>
<b:if cond='data:post.thumbnailUrl'>
<img class='post-thumbnail' expr:alt='data:post.title' expr:src='data:post.thumbnailUrl' width='70px' height='70px'/>
<b:else/>
<img class='post-thumbnail' alt='no image' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgjRfRp39yNSr5EUTGX66FqE2J5CfemgI93VohF9SrCLXU84oZPeJCVwYm72gQgbkzpXuVj7darCCloFyJA0R2RdE2WtWQDybXQ1dx5fvxnGBjsmqT3WJJfQao23fiRI0chW2eeDgfXUGy4/' width='70px' height='70px'/>
</b:if>
<data:post.snippet/>
</div>
<div class='jump-link'>
<a expr:href='data:post.url' expr:title='data:post.title'><data:post.jumpText/></a>
</div>
<b:else/>
<data:post.body/>
</b:if>
<b:else/>
<data:post.body/>
</b:if>
Nguồn DuyPham

Không có nhận xét nào:

Đăng nhận xét