"Tiện ích Slider News cho Blogspot với hiệu ứng JQuery"

(Traidatmui.com) – Bài viết hôm nay mình chia sẽ cùng các bạn cách trình bài những bài viết mới trên Blogspot rất gọn và kết hợp với hiệu ứng bằng JQuery trông cũng khá hấp dẫn. Cách trình diễn bài viết mới theo kiểu này cũng đã được nhiều web/blog ứng dụng. Và hôm nay mình sẽ hướng dẫn các bạn cách để sử dụng nó trong Blogspot. Tiện ích này chỉ hiển thị tiêu đề của bài viết và với hiệu ứng slide trông khá ấn tượng.

» Bắt đầu thủ thuật

1. Đăng nhập vào tài khoản Blogger
2. Vào phần thiết kế (Design)
3. Chọn chỉnh sửa HTML (Edit HTML)
4. Chèn code bên dưới vào sau thẻ <head>
<script src="http://data-traidatmui.appspot.com/scripts/jquery.min.js" type="text/javascript"/></script>
<script type="text/javascript" src="http://data-traidatmui.appspot.com/scripts/jquery.inner.fade.js"></script>

<script type="text/javascript"> $(document).ready( function(){ $('#news').innerfade({ animationtype: 'slide', speed: 750, timeout: 2000, type: 'random', containerheight: '1em' }); $('#portfolio').innerfade({ speed: 'slow', timeout: 4000, type: 'sequence', containerheight: '220px' }); $('.fade').innerfade({ speed: 'slow', timeout: 1000, type: 'sequence', containerheight: '1.5em' }); } ); </script>
<style>
.slidenews{font-size:12px;
font-family:arial;
margin:0px;}
.slidenews ul li{list-style-type:none;}
.slidenews a{margin-left:0px;color:#000; /*màu của tiêu đề bài viết*/
}
.slidenews a:hover{color:#666;}
</style>

5. Save template lại và trở về phần tử trang (Page Elements)
6. Thêm 1 HTML/Javascript và thêm vào code bên dưới
<script language="JavaScript">
imgr = new Array();
showRandomImg = false;
numposts =5; //số bài viết hiển thị, ở đây mình chỉ mặc định số này bằng 5
home_page = "http://www.traidatmui.com/"; //thay thành địa chỉ blog của bạn
</script>
<div class="slidenews">
<script src="http://data-traidatmui.appspot.com/scripts/slidernews_post.js" type="text/javascript">
</script></div>

7. Save tiện ích lại là xong

Chúc bạn thành công

Xem khác cùng chủ đề

3 nhận xét | Viết lời bình

7/15/2011 06:05:00 SA Trả lời

Cái này đẹp đấy nhưng chạy có làm giảm nhiều tốc độ blog không ad ui votay

Admin
7/22/2011 12:40:00 SA Trả lời

Nếu blog bạn không quá nhiều hiệu ứng thì nó sẽ không làm giảm tốc độ load trang bạn nhiều đâu.

7/24/2015 02:20:00 SA Trả lời

Bạn ơi bên mình có dịch vụ Đăng tin tự động lên groups trên facebook miễn phí bạn xem qua nhé. miễn phí 100%
Ngoài ra các bạn có thể đọc tin tức tại Kênh tin tức giải trí yeubao.com
Các bạn có thể truy cập link sau để xem thông tin công nghệ
Khoinguoncongnghe.net | kênh thông tin dành cho tín đồ công nghê
cám ơn bạn đã đọc
đăng tin tự động trên facebook miễn phí 100% xem tại Đăng tin tự động lên groups trên facebook miễn phí
xem thủ thuật blogspot, thủ thuật blogger, thủ thuật facebook tại thủ thuật tổng hợp facebook, blogger,coputuer
xem tin tức giới trẻ, các tin nổi bật tin tức nổi bật, tin sao, tin giới trẻ, đời sống xã hội
xem thong tin giải trí, cung hoàng đạo, tại bí mật 12 chòm sao,tâm sự,blog tâm sự

giải trí thư giã relax giải trí thư giãn relax
khám phá du lịch, bi ẩn khám phá du lịch, bí ẩn
kho video giải trí khổng lồ video đời sống xã hội, video giải trí
khởi nguồn công nghệ, xem tin tức công nghệ, tin tức internet
tin tức internet
Tin tức itc , tin tức technogoy tin tức ict

Khám phá công nghệ
khám phá

Thủ thuật công nghê thủ thuật công nghệ, tips





Bạn nhập từ: cungly Bạn nhập từ: lleu Bạn nhập từ: kkrong Bạn nhập từ: cuoilon Bạn nhập từ: roile Bạn nhập từ: hehehe Bạn nhập từ: byebye Bạn nhập từ: idontknow Bạn nhập từ: votay more »

Giải pháp bán hàng online Số 1 Việt Nam
Lên đầu trang Xuống cuối trang