2/2/13

Recent posts - Bài viết gần đây cho blogspot V2 - Thủ thuật

Thủ thuật blogspot RECENT POSTS - bài viết mới cho blogger đã được mình giới thiệu ở bài viết Recent posts - Bài viết mới thanh cuộn cho blogger. Ở bài viết này mình cũng làm một thủ thuật tương tự nhưng có khác Style nên tạm gọi nó là Version 2 ^^. Đối với V2 này bài viết mới sẽ có dạng trái ngược với V1. Đó là hình ảnh hiển thị ở phía bên phải, hiển thị thêm 1 đoạn nội dung mô tả, và khi chạy thanh cuộn cho slide bài viết mới gần đây thì cũng không có hiệu ứng làm mất như V1
recent posts for blogspot
DEMO NHÌN TIỆN ÍCH BÀI VIẾT MỚI ĐĂNG TẠI TRANG ITVIET360
Cách làm thủ thuật:
- Vào bảng điều khiển blogger -> Bố cục (Layout) -> Thêm tiện ích (Add a Widget) -> HTML/Javascript
- Dán Code dưới đây vào tiện ích vừa thêm:

<style>img.recent_thumb {padding:1px;width:55px;height:55px;border:0;float:right;margin:0 0 5px 10px;}.recent_posts_with_thumbs {float: left;width: 100%;min-height: 70px;margin: 5px 0px 5px 0px;padding: 0;font-size:12px;}ul.recent_posts_with_thumbs li {padding-bottom:5px;padding-top:5px;min-height:65px;}.recent_posts_with_thumbs a {text-decoration:none;}.recent_posts_with_thumbs strong {font-size:10px;}</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script style='text/javascript' src="http://itviet360.googlecode.com/files/recent-v2.js" ></script>
<script style='text/javascript' src='http://itviet360.googlecode.com/files/recent-v2-itviet360.js'></script>
<script style='text/javascript'>
var numposts = 15;
var showpostthumbnails = true;
var displaymore = false;
var displayseparator = false;
var showcommentnum = false;
var showpostdate = false;
var showpostsummary = true;
var numchars = 100;
$(document).ready(function () {$('#sai').vTicker({
speed: 500,
pause: 3000,
showItems: 4,
animation: 'fade',
mousePause: false,
height: 100,
direction: 'up'
});});
</script>
<div id="sai">
<script src='http://www.itviet360.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentpostswiththumbs'></script>
</div>

Trong đó các bạn tùy chỉnh cho phù hợp:
var numposts = 15;: Giá trị số bài viết mới nhất sẽ chạy trong thanh cuộn
var numchars = 100;: Ký tự miêu tả cho bài viết.
showItems: 4,: Số bài viết hiển thị trên thanh cuộn
www.itviet360.com: Tên miền Blogspot của các bạn

Chúc các bạn vui vẻ !

0 nhận xét:

Post a Comment