▀▄▀▄▀▄▀▄▀▄▀▄ 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)

TẠO HỘP ẨN BÌNH LUẬN MỚI NHẤT (NEW COMMENTS)

Trước đây, dunghennesy tôi có chia sẻ với các bạn tiện ích TẠO HỘP BÌNH LUẬN MỚI NHẤT trên Blogspot (các bạn có thể xem TẠI ĐÂY). 
Hôm nay, mình tiếp tục chia sẻ với các bạn thêm một tiện ích khác về các Bình luận mới nhất trên Blog của mình.
Tương tự ở thủ thuật này, các lời bình luận (comments) của khách tham quan sẽ được nằm gọn gàng trong một hộp chữ nhật và hộp này được ẩn vào bên phải của trang Blog, khi muốn xem bạn bấm vào thẻ BÌNH LUẬN MỚI thì hộp này mới xuất hiện với hiệu ứng "chạy ra" rất mướt. Các lời bình luận được sắp xếp theo thứ tự thời gian (bình luận mới nhất sẽ nằm ở dòng đầu tiên) đi kèm với Avatar của khách được thể hiện bằng hình vuông và vài dòng bình luận ngắn gọn, khi không muốn xem nữa bạn bấm lại thẻ BÌNH LUẬN MỚI lần nữa hoặc bấm thẻ "Đóng lại" phía dưới của hộp thì hộp này sẽ ẩn vào bên phải như trước...Hộp bình luận này luôn luôn xuất hiện trên blog cho dù bạn có kéo thanh trượt xuống giữa trang hay cuối trang blog...Rất tiện lợi không chiếm không gian của blog.
Mời các bạn bấm vào thẻ XEM THỬ để trải nghiệm trước thủ thuật này nha.



Xem thử

Để làm được tiện ích này, đầu tiên bạn đăng nhập vào Blog chọn MẪU > CHỈNH SỬA HTML.



Một bảng mã nguồn HTML của Blog xuất hiện, tiếp tục bạn bấm cặp phím Ctrl +F để mở hộp tìm kiếm, bây giờ bạn gõ vào đó dòng lệnh <head>Enter, bạn sẽ thấy dòng lệnh <head> này sẽ được đánh dấu highlight ở bảng mã nguồn HTML.



Bây giờ bạn copy tất cả các code dưới đây dán vào sau (dưới) dòng lệnh <head> này.

<style type='text/css'>
#gb{
position:fixed;
top:20px;
z-index:+1000;
right:3px;
}
* html #gb{position:relative;}

.gbtab{
margin-top:-1px;
height:200px;
width:30px;
float:left;
cursor:pointer;
background:url(http://1.bp.blogspot.com/-AZjo6jWYdW8/Uhremki2sFI/AAAAAAAAmuo/4Yltt7U5mJ0/s1600/picture4.jpg) no-repeat;
}
.gbcontent{
float:left;
border:3px solid #FFFFFF;
background: url(http://1.bp.blogspot.com/-J8gBW8XU4LQ/UhqFLe51iWI/AAAAAAAAmuM/XyW16Tbt5Sw/s1600/picture5.jpg);
padding:5px 15px 3px 15px;
line-height:1.3em;}
</style>

<script type='text/javascript'>
function showHideGB(){
var gb = document.getElementById(&quot;gb&quot;);
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 24-w) : moveGB(20-w, 0);
gb.opened = !gb.opened;
}
function moveGB(x0, xf){
var gb = document.getElementById(&quot;gb&quot;);
var dx = Math.abs(x0-xf) &gt; 10 ? 5 : 1;
var dir = xf&gt;x0 ? 1 : -1;
var x = x0 + dx * dir;
gb.style.right = x.toString() + &quot;px&quot;;
if(x0!=xf){setTimeout(&quot;moveGB(&quot;+x+&quot;, &quot;+xf+&quot;)&quot;, 10);}
}
</script>


Tiếp tục bạn bấm LƯU MẪU để lưu lại các sửa đổi.
Sau khi LƯU MẪU, bạn bấm vào thẻ BỐ CỤC ở bên trái và thêm tiện ích HTML/Javacript (nếu chưa biết cách thêm bạn xem TẠI ĐÂY).
Tiếp đến, bạn copy tất cả các đoạn code dưới đây dán vào tiện ích HTML/Javacript
 
<div id="gb">
<div class="gbtab" onclick="showHideGB()">
</div>
<div class="gbcontent">
<strong><span style=" "></span></strong>

<center>

<center><div style="font-weight:bold; border: 2px #30a1db solid; padding:5px; text-align:center; background:#FFF380;"><span style="color: red; font-size: large;">Bình luận mới nhất của các bạn</span></div>
<div style="border: 5px solid orange; color: cyan; height: 650px; margin: 5px 0; overflow: auto; padding: 15px; text-align: left; width: 300px;">
<style type="text/css">
    ul.w2b_recent_comments{list-style:none;margin:0;padding:0;}
    .w2b_recent_comments li{background:#ffffff!important;margin:0 0 6px !important;padding:0 0 6px 0 !important;display:block;clear:both;overflow:hidden;list-style:none;}
    .w2b_recent_comments li .avatarImage{padding:3px;background:none;-webkit-box-shadow:0 1px 1px #ccc;-moz-box-shadow:0 1px 1px #ccc;box-shadow:0 1px 1px #ccc;float:left;margin:0 6px 0 0;position:relative;overflow:hidden;}
    .avatarRound{-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;}
    .w2b_recent_comments li img{padding:0px;position:relative;overflow:hidden;display:block;}
    .w2b_recent_comments li span{margin-top:4px;color: #666;display: block;font-size: 12px;font-style: italic;line-height: 1.4;}
</style>
<script type="text/javascript">
//<![CDATA[
    // Recent Comments Settings
    var
 numComments  = 200,
 showAvatar  = true,
 avatarSize  = 60,
 roundAvatar = true,
 characters  = 60,
 defaultAvatar  = "http://www.gravatar.com/avatar/?d=mm",
 hideCredits = true;
//]]>
</script>
<script src="https://sites.google.com/site/dunghennessyjs/comment2.js" type="text/javascript"></script>
<script src="http://www.dunghennessy.blogspot.com/feeds/comments/default?alt=json&amp;callback=w2b_recent_comments&amp;max-results=200" type="text/javascript"></script>
</div>
</center>
</center>
<div style="text-align: right;"><span style="float:left; ">Widget by dunghennessy</span>
<a href="javascript:showHideGB()">[Đóng lại]
</a></div></div></div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (24-gb.offsetWidth).toString() + "px";
</script>

Bạn có thể thay đồi dòng lệnh màu vàng theo ý muốn của mình và thay đổi dòng lệnh màu đỏ là tên blog của bạn, cuối cùng bấm LƯU và quay trở lại blog xem thành quả nha.
Chúc bạn thành công!!!


13 nhận xét:

tran van tha nói...

cam on anh bai viet cua anh rat hay

dungheineken nói...

Cám ơn bạn đã ghé tham quan và ủng hộ dunghennessy
Chúc bạn luôn vui vẻ và hạnh phúc

Chuyên Sỉ Thời Trang nói...

Chào anh sao em làm như anh ma không được anh ạ. Em thử comment nhưng ko đc. Anh giúp em với. blog của em: http://www.thoitrangcongsodalat.com
Thanks

Dung PHAM HOANG nói...

Lỗi trên là do em ghi địa chỉ blog của em không đúng, em chỉnh sửa lại cho chính xác là sẽ xuất hiện liền..thử lại xem nha
Chúc em thành công

Lê Trung Quân nói...

anh dũng ơi code này hok ứng dụng cho bình luận face book đc hả anh

Dung PHAM HOANG nói...

Oh..Vì Facebook Anh không có "chơi" nên không biết có được hay không nữa, em thử đổi dòng lệnh màu đỏ thành địa chỉ Facebook xem có được không nha.

Lê Trung Quân nói...

hok đc rồi anh dũng ơi. Làm sao quản lý bình luận đc đây
Làm sao trả lời bình luận kịp thời được hjx

Dung PHAM HOANG nói...

Sorry, Anh cũng "bó tay" luôn, Em thử cầu cứu các cao thủ khác xem sao

sinh tran nói...

Cảm ơn bạn với những tiện ích rát hữu ích, đẹp, hay cho blogspot ! Chúc bạn luôn có thật nhiều niềm vui !

Anh Hùng Đặng nói...

anh ơi,em để tẹn miền blogspot thi bình thường,nhưng khi dns tên miền riên vô thì nó ko hiện comment,anh xem giúp em với,thank nhiều lắm http://demo-ccv.blogspot.com

LIÊN ĐỘI 8 THANH NIÊN XUNGPHONG nói...

sao avatar của tôi trong hộp bình luận vẫn là chữ B ?

LIÊN ĐỘI 8 THANH NIÊN XUNGPHONG nói...

CÓ CÁCH NÀO CÓ AVATAR NHƯ Ý MÌNH THAY VÌ CHỮ B ? GIÚP TÔI VỚI NHÉ. CÁM ƠN NHIỀU.

Tam Le nói...

anh ơi...anh giúp em sửa lỗi này không ạ..trang web của em nó bị đoạn code gì ấy làm cho mất phần comment của google và facebook anh ạ..em thêm bình luận của facebook vào không được anh ạ...anh xem giúp em trang này nhé ạ:http://www.loaphuong36.com

Đăng nhận xét

 
Powered by by: Blogger