Hướng dẫn hộ mình làm cái like facebook, zing, số lần xem chủ đề của 4rum bên slidebar được không admin nhỉ?: Mình tìm trên diễn đàn rồi nhưng ko thấy hướng dẫn làm cái này. Thank nhiều nhé.
Thêm vào cuối showthread.css Mã: /*cong cu ben trai */ .side-sharebar { top: 147px; left: 7.8%; background-color: #EEE; border: 1px solid #CCC; border-right: none; position: fixed; -webkit-box-shadow: -6px 0 6px -6px rgba(0,0,0,0.25) inset,0 1px 0 #fff inset; -moz-box-shadow: -6px 0 6px -6px rgba(0,0,0,0.25) inset,0 1px 0 #fff inset; box-shadow: -6px 0 6px -6px rgba(0,0,0,0.25) inset,0 1px 0 #fff inset; -webkit-border-radius: 3px 0 0 3px; -moz-border-radius: 3px 0 0 3px; border-radius: 3px 0 0 3px; padding:0px; } .side-sharebar .item { border-bottom: 1px solid #CCC; -webkit-box-shadow: 0 1px 0 #fff; -moz-box-shadow: 0 1px 0 #fff; box-shadow: 0 1px 0 #fff; padding: 10px 2px 10px 0; text-align: center; width: 76px; } .side-sharebar .item:last-child{ border:none; -webkit-box-shadow:none; -moz-box-shadow:none; box-shadow:none; font-size:.8em; line-height:1.133em; } .side-sharebar .recentCount{ display:block; text-align:center; width:58px; height:40px; padding:2px 0 0 0!important; background-color:#b7b7b8; background:none,-khtml-gradient(linear,left top,left bottom,from(#d7d8d9),to(#aaaaab)); background:none,-moz-linear-gradient(top,#d7d8d9 0,#aaaaab 100%); background:none,-webkit-gradient(linear,left top,left bottom,color-stop(0,#d7d8d9),color-stop(100%,#aaaaab)); background:none,-webkit-linear-gradient(top,#d7d8d9 0,#aaaaab 100%); background:none,-o-linear-gradient(top,#d7d8d9 0,#aaaaab 100%); background:none,-ms-linear-gradient(top,#d7d8d9 0,#aaaaab 100%); background:none,linear-gradient(top,#d7d8d9 0,#aaaaab 100%); color:#39434c; border:1px solid #A7A7A8; -webkit-box-shadow:0 1px 0 #8b8b90,0 1px 0 0 rgba(255,255,255,0.4) inset; -moz-box-shadow:0 1px 0 #8b8b90,0 1px 0 0 rgba(255,255,255,0.4) inset; box-shadow:0 1px 0 #8b8b90,0 1px 0 0 rgba(255,255,255,0.4) inset; -moz-text-shadow:0 1px 0 rgba(255,255,255,0.65); -webkit-text-shadow:0 1px 0 rgba(255,255,255,0.65); -khtml-text-shadow:0 1px 0 rgba(255,255,255,0.65); text-shadow:0 1px 0 rgba(255,255,255,0.65); -webkit-border-radius:3px; -moz-border-radius:3px; border-radius:3px; font-size:10px; font-weight:bold; -webkit-box-shadow:0 2px 0 #8b8b90; -moz-box-shadow:0 2px 0 #8b8b90; box-shadow:0 2px 0 #8b8b90; position:relative; margin:0 auto; text-decoration: none; } .side-sharebar .recentCount .countNumber{ font-size:1.8em; } .side-sharebar .recentCount:after{ width:0; height:0; border-top:5px solid #aaaaab; border-bottom:5px solid transparent; border-right:5px solid #aaaaab; display:block; position:relative; bottom:-7px; position:absolute; right:10px; } .side-sharebar .recentCount:before{ width:0; height:0; border-top:5px solid #8b8b90; border-bottom:5px solid transparent; border-right:5px solid #8b8b90; display:block; position:relative; bottom:-8px; position:absolute; right:10px; } #shareBar p.recentCount{ font-weight:bold; } .rqd { text-align: center; display: block; } .rqd_count { font-family: Arial, Helvetica, sans-serif; font-size:12pt; background-image: url('../vtlai_img/rqd_count_bg.gif'); background-repeat: no-repeat; background-position: center top; margin: 0px; padding: 0px; padding-top: 7px; height: 35px; border: 0px; vertical-align:middle; } .rqd_btn { font-family: Arial, Helvetica, sans-serif; font-size:11px; display: block; text-decoration: none; padding: 3px; padding-left:12px; text-align: center; -webkit-border-radius:3px; -moz-border-radius:3px; border-radius:3px; background-color: #eceef5; border: 1px solid #cad4e7; background-image: url('../vtlai_img/rqd_btn_bg.png'); background-repeat: no-repeat; background-position: left center; color: #003; width: 50px; margin-left: auto; margin-right: auto; } .rqd_btn:visited,.rqd_btn:active { color:#003; } .rqd_btn:hover { border-color: #9dacce; color: blue; } Thêm vào SHOWTHREAD, trên </body> Mã: <!--cong cu ben trai--> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script> <script type="text/javascript"> $(function() { $(window).bind("resize", function() { $('#noidung').toggle($(this).width() > 1300); }).trigger("resize"); }); </script> <menu class="shareBar side-sharebar" id="noidung"> <div class="item"> <p class="recentCount"><span class="countNumber">{vb:raw thread.views}</span><br>Lượt xem</p> </div> <div class="item"> <div class="item"> <iframe src="http://www.facebook.com/plugins/like.php?href=http://2mit.org/forum/{vb:link thread, {vb:raw thread}}&send=false&layout=box_count& amp;width=52&show_faces=false&action=like& amp;colorscheme=light&font=arial&height=62 " scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:52px; height:62px;" allowTransparency="true"></iframe> </div> </div> <div class="item"> <a name="fb_share" type="button_count" share_url="http://2mit.org/forum/{vb:link thread}" href="http://www.facebook.com/sharer.php">Share</a><script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script> </div> <div class="item"> <a href="javascript:void(window.open('http://link.apps.zing.vn/share?u=http://2mit.org/forum/{vb:link thread}','','top=20, left=250,scrollbars=no,width=600,height=500')) "><img src="http://img.zing.vn/ani/skin/ani-112011/images/icon_zingme.png"></a> </div> <div class="item"> <!-- Place this tag where you want the +1 button to render --> <g:plusone size="tall"></g:plusone> <!-- Place this render call where appropriate --> <script type="text/javascript"> (function() { var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true; po.src = 'https://apis.google.com/js/plusone.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s); })(); </script> </div> </menu> <!--cong cu ben trai--> Tự động ẩn đi đối với những máy có độ phân giải màn hình < 1300 (tức là dùng laptop mới thấy) Bạn nào muốn thay đổi độ phân giải cần hiển thị thì thay thông số ở dòng $('#noidung').toggle($(this).width() > 1300);
