▀▄▀▄▀▄▀▄▀▄▀▄ Các bài đăng mới ▀▄▀▄▀▄▀▄▀▄▀
    Kenh sctv1 Kenh sctv1 Kenh sctv1
    Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1
    Kenh sctv1 Kenh sctv5 Kenh HTV2 Kenh SCTV16




Xem truyền hình trực tuyến (Click here)

TIỆN ÍCH BÀI VIẾT VỚI HIỆU ỨNG RƠI TỪ TRÊN XUỐNG

Để gắn tiện ích bài viết mới có kèm ảnh với hiệu ứng "rơi" từ trên xuống, các bạn cần làm các bước sau:
Đầu tiên, bạn đăng nhập Blog > chọn Thiết kế > chọn Thêm tiện ích > Thêm HTML/Javacript, sau đó dán tất cả các code này vào







<style type="text/css">

#spylist {
overflow:hidden;
margin-top:5px;
height:450px; /* độ cao của tiện ích*/
}
#spylist ul{
overflow:hidden;
list-style-type: none;
padding: 0px;

}
#spylist li {
border:1px dotted #0000ff;
width:208px; /* độ rộng của tiện ích*/
margin:0px 0px 5px 0px;
padding:2px 1px 2px 2px;
list-style-type:none;
float:none;
height:60px; /* độ cao của mỗi tiêu đề bài viết*/
overflow: hidden;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhpR91V6MfITGRlxlSdaR80gtC7O2IMLaincPQaRjjfibiaQW0ZPyGCYupZXdHtUMXUoV4T7hqWIy2kc7ywmvi98Xs39YvhuFrk4t_NkITlgjSZ29cA3H0jbGZno_VkhkfeRlaYieEGjBEv/); /* màu nền của tiện ích*/
}

#spylist li a {
text-decoration:none;
color:#0066cc;
font-size:11px;
height:18px;
overflow:hidden;
margin:0px 0px 0px 0px;
padding:0px 0px 2px 0px;
}
#spylist li a:hover{
text-decoration:underline;
color:#ff0000;
}
#spylist li img {
float:left;
margin-right:5px;
border:1px;
}
.spydate{
overflow:hidden;
font-size:10px;
color:#ff0066;
padding:2px 0px;
margin:1px 0px 0px 0px;
height:15px;
font-family:Tahoma,Arial,verdana, sans-serif;
}

.spycomment{
overflow:hidden;
font-family:Tahoma,Arial,verdana, sans-serif;
font-size:10px;
color:#262B2F;
padding:0px 0px;
margin:0px 0px;
}

</style>
<script src="http://dl.dropbox.com/u/66348944/jquery.min.js" type="text/javascript"></script>
<script language="JavaScript">

imgr = new Array();

imgr[0] = "http://img138.imageshack.us/img138/7159/noimage.jpg";

limitspy = 6; //số bài trình diễn
intervalspy = 4000; //tốc độ chuyển đổi bài viết
showRandomImg = true;

boxwidth = 255;
cellspacing = 0;
borderColor = "#000000";
bgTD = "#fff";
thumbwidth = 60; //độ rộng ảnh thumb
thumbheight = 60; //độ cao ảnh thumb
fntsize = 12;
acolor = "#666";
aBold = true;
icon = " ";
text = "no"; //nếu muốn hiển thị số comment thì bạn thay "no" thành "comments"
showPostDate = false;
summaryPost = 40;
summaryFontsize = 10; //kích thước của text
summaryColor = "";
icon2 = " ";
numposts = 10; //số bài viết hiển thị
label = "Advanced blogger"; //nhãn bài viết (nếu hiển thị theo bài viết thì không cần quan tâm)
home_page = "http://www.dungheineken.blogspot.com/"; //địa chỉ blog của bạn
</script>
<div id="spylist"><script src="http://dl.dropbox.com/u/66348944/recent_post_spy.js" type="text/javascript"></script></div>

Sau đó, bạn thay đổi địa chỉ Blog của bạn và bạn có thể thay đổi các tùy chỉnh như trên code đã chú thích để chọn cho mình một tiện ích đẹp nhất nha. Cuối cùng bấm lưu lại và quay trở lại Blog xem kết quả. 
Ở code trên thì thủ thuật này sẽ hiển thtất cả các bài ở Web/Blog, nếu muốn thủ thuật chỉ hiển thở một nhãn nhất định, bạn thay thế dòng code cuối cùng (màu đỏ) thành đoạn code như sau:
  
https://dl.dropbox.com/u/66348944/recent_label_spy.js


Với mã code ở trên thì chúng ta sẽ có tiện ích giống như thế này:




Xem thử




33 nhận xét:

tung5a nói...

sau em làm rùi mà nó không rơi xuống zậy anh.

dunghennessy nói...

Do trên Boog của em sử dụng nhiều code Javacript nên nó bị xung đột rồi, em phải xoá bỏ bớt thì mới được

Trần Đăng Nghiêm nói...

Bạn ơi ! Mình làm được nhưng tiêu đề con dài quá nó không tự nhảy xuống được. Bạn xem giùm mình nhé
Blog của mình:
http://thuphapdangnghiem.blogspot.com/

Cám ơn bạn rất nhiều.

Trần Đăng Nghiêm nói...

Ui mình làm được rồi. Thì ra tại mình chưa chỉnh chiều rộng lại. Dù sao cũng cảm ơn bạn rất nhiều. Mình làm được blog này là nhờ bạn đó.

dunghennessy nói...

Tôi đã vào blog của bạn và thấy nó rơi xuống khá đẹp mắt mà, đâu có bị lỗi gì đâu bạn...

Trần Đăng Nghiêm nói...

Bạn Dũng ơi! Mình thấy blog của bạn khi ở ngoài trang chủ thi sidebar nằm bên phải nhưng khi vào xem bài viết thì side bar đổi sang bên trái. Bạn chỉ mình với. hihi.

dunghennessy nói...

À, cái này là do mặc định của giao diện này, mình không có chỉnh sửa gì cả...

Unknown nói...

Dunghennessy ơi , nếu mình muốn nó hiển thị theo nhãn thì làm sao vậy ?

Unknown nói...

Dunghennessy ơi , nếu mình muốn nó hiển thị theo nhãn thì làm sao vậy ?

Unknown nói...

Dunghennessy ơi , nếu mình muốn nó hiển thị theo nhãn thì làm sao vậy ?

Mình đã thử ghi tên nhã vào phần label = " tên nhãn " nhưng ko đc

dunghennessy nói...

Mình đã bổ sung thêm đoạn code phía dưới rồi đó, bạn thay thế đoạn code cuối cùng nha (nhớ ghi thật chính xác tên nhãn của bạn thì nó mới hiển thị đó...)
Chúc bạn thành công

Unknown nói...

Mình làm theo y chang cách hướng dẫn bài viết mà sao nó không hiện ra? bạn xem lý do tại sao,xin hướng dẫn rõ thêm,mình sợ là phải cần add thêm Link gì đó.Cảm ơn nhiều.

Unknown nói...

Bạn nói ghi chính xác tên nhãn,mà nhãn thì nhiều lắm,làm sao ghi hết từng đó nhãn được,mà ghi nhiều nhãn thì ghi thế nào mình cũng chưa rõ?Hiện mình đang để code mặc định theo bài viết chứ không theo từng nhãn,nó cũng chẳng hiện ra bài nào.

dunghennessy nói...

Bạn chưa hiểu rồi, thủ thuật này chỉ áp dụng cho một nhãn nhất định thôi, ví dụ: trong blog của bạn có nhiều nhãn như thủ thuật nâng cao, cơ bản, trang trí blog chẳng hạn thì bạn chỉ làm được một nhãn nhất định trong 3 nhãn này thôi bạn à.
Còn code ở trên thì hiển thị cho tất cả các bài viết mới nhất ở trong blog thì bạn chỉ cần thay đổi dúng địa chỉ của Blog mình là Ok (không cần thêm link gì cả...)

Unknown nói...

Mình xóa một đoạn code trong HTML giờ nó mới chịu hiện ra.Cảm ơn bạn.

Unknown nói...

Mình làm cái Widget này mục đích giống như một danh sách các bài đăng vì không muốn ngoài home trông nó bớt luộm thuộm,không nhằm rei6ng vào bất cứ một nhãn nào,code này là đúng ý mình.Cảm ơn bạn.

Unknown nói...

Hôm nay cuối tuần bạn rảnh thì mình mời bạn chầu Cafe nếu bạn oke thì nhắn tin cho mình biết,giờ đang rảnh mà lại buồn ngủ thèm cafe nè ! Hi !

dunghennessy nói...

Cám ơn bạn vì lời mời, mặc dù cuối tuần nhưng mình vẫn trực ở cơ quan bạn à nên không thể cùng bạn "uống cafe" được. Thông cảm cho mình nha, hẹn khi khác

Unknown nói...

Oke ! Vậy hẹn gặp nhau dịp khác,chúc bạn làm việc vui vẻ.

Unknown nói...

Hôm nay bị lỗi gì lại không chạy.

dunghennessy nói...

Mình đã có gắn thông báo rồi mà: hiện tại mình đang khắc phục sự cố các file .js của mình, khi hoàn thành xong sẽ chạy lại mà

Unknown nói...

Bạn cho hỏi tí,sao mình làm dc rồi nhưng dòng tiêu đề bài viết hiển thị lại thiếu chữ,mình cần phải điều chỉnh lại ở thông số nào đây?Cảm ơn bạn.

dunghennessy nói...

Bạn thử thay đổi chiều rộng của tiện ích (tăng cao hơn) hoặc thay đổi font chữ nhỏ lại xem...

Unknown nói...

Mình nhìn thấy cái hình mẫu ở trên của bạn ,cái tiêu đề còn xuống dòng,của mình nó cứ dài ngoằng 1 hàng thôi.

dunghennessy nói...

Mình áp dụng code này đó (không có sửa đổi gì...), còn của bạn thì bạn thử chỉnh lại độ rộng của tiện ích xem

Unknown nói...

hoặc a vào chỉnh sữa bài đăng của e nhé . bài e mới đăng ấy

dunghennessy nói...

Rồi, anh đã thêm chữ vào hình cho em rồi đó, em vào xem thử (vì font chữ của hình trước Anh không có nên anh thay font chữ khác...)

Unknown nói...

Mình làm được rồi,phải thu nhỏ lại chiều rộng lại một tí nó mới chịu xuống hàng.Cảm ơn Dung nhiều.

dunghennessy nói...

Chúc mừng bạn nhe...

Hair Black nói...

A Dũng ơi tiện ích này có dùng được trong blog wordpress ko?

dunghennessy nói...

À, vì anh chỉ chuyên dùng Blogspot mà thôi nên cũng không biết nó có sử dụng cho Wordpress được không nữa, em thử xem sao???

Unknown nói...

Cảm ơn bạn đã cho mình Link dẫn bài viết này,mình đã làm lại code chạy tốt rồi,nhưng còn một thắc mắc nhỏ là làm sao để copy file Javacrip như ở một bài viết khác bạn có đề cập để mình chủ động up lên host riêng sau này sử dụng được ổn hơn? úp lên host thì mình biết cách rồi còn copy thế nào từ cái Link có đuôi .js thì mình chưa hiểu lắm.Cảm ơn.

dunghennessy nói...

Ok, để hôm nào mình sẽ post bài theo yêu cầu của bạn rồi bạn vào tham khảo nha

Đăng nhận xét

 
Powered by by: Blogger