jQuery Pop-up Facebook Like Box

Cửa sổ Like Facebook sử dụng jQuery cho Blogger và bạn có thể thiết lập widget này chỉ xuất hiện trên blog lần đầu truy cập sẽ không gây khó chịu cho độc giả, tất nhiên cũng sẽ có lựa chọn luôn xuất hiện mỗi khi truy cập blog

Làm cách nào để thêm jQuery Pop-up Facebook Like Box?
Bước 1: Vào blogger > Mẫu > Chỉnh sửa HTML
Bước 2: Chèn code bên dưới trước thẻ </body>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js'/><script src='https://trollvlhcv.googlecode.com/svn/trunk/likebox/jquery.colorbox-min.js'/><style>#colorbox, #cboxOverlay, #cboxWrapper{position:absolute;top:0;left:0;z-index:9999;overflow:hidden;}#cboxOverlay{position:fixed;width:100%;height:100%;}#cboxMiddleLeft, #cboxBottomLeft{clear:left;}#cboxContent{position:relative;}#cboxLoadedContent{overflow:auto;}#cboxTitle{margin:0;}#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute;top:0;left:0;width:100%;}#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}.cboxPhoto{float:left;margin:auto;border:0;display:block;}.cboxIframe{width:100%;height:100%;display:block;border:0;}/**/#cboxOverlay{background:#000;opacity:0.5 !important;}#colorbox{/*box-shadow*/-webkit-box-shadow:0 0 15px rgba(0,0,0,0.4);-moz-box-shadow:0 0 15px rgba(0,0,0,0.4);box-shadow:0 0 15px rgba(0,0,0,0.4);}#cboxTopLeft{width:14px;height:14px;background:url(https://trollvlhcv.googlecode.com/svn/trunk/likebox/controls.png) no-repeat 0 0;}#cboxTopCenter{height:14px;background:url(https://trollvlhcv.googlecode.com/svn/trunk/likebox/border.png) repeat-x top left;}#cboxTopRight{width:14px;height:14px;background:url(https://trollvlhcv.googlecode.com/svn/trunk/likebox/controls.png) no-repeat -36px 0;}#cboxBottomLeft{width:14px;height:43px;background:url(https://trollvlhcv.googlecode.com/svn/trunk/likebox/controls.png) no-repeat 0 -32px;}#cboxBottomCenter{height:43px;background:url(https://trollvlhcv.googlecode.com/svn/trunk/likebox/border.png) repeat-x bottom left;}#cboxBottomRight{width:14px;height:43px;background:url(https://trollvlhcv.googlecode.com/svn/trunk/likebox/controls.png) no-repeat -36px -32px;}#cboxMiddleLeft{width:14px;background:url(https://trollvlhcv.googlecode.com/svn/trunk/likebox/controls.png) repeat-y -175px 0;}#cboxMiddleRight{width:14px;background:url(https://trollvlhcv.googlecode.com/svn/trunk/likebox/controls.png) repeat-y -211px 0;}#cboxContent{background:#fff;overflow:visible;}#cboxLoadedContent{margin-bottom:5px;}#cboxLoadingOverlay{background:url(https://trollvlhcv.googlecode.com/svn/trunk/likebox/loadingbackground.png) no-repeat center center;}#cboxLoadingGraphic{background:url(https://trollvlhcv.googlecode.com/svn/trunk/likebox/loading.giff) no-repeat center center;}#cboxTitle{position:absolute;bottom:-25px;left:0;text-align:center;width:100%;font-weight:bold;color:#7C7C7C;}#cboxCurrent{position:absolute;bottom:-25px;left:58px;font-weight:bold;color:#7C7C7C;}#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{position:absolute;bottom:-29px;background:url(https://trollvlhcv.googlecode.com/svn/trunk/likebox/controls.png) no-repeat 0px 0px;width:23px;height:23px;text-indent:-9999px;}#cboxPrevious{left:0px;background-position:-51px -25px;}#cboxPrevious.hover{background-position:-51px 0px;}#cboxNext{left:27px;background-position:-75px -25px;}#cboxNext.hover{background-position:-75px 0px;}#cboxClose{right:0;background-position:-100px -25px;}#cboxClose.hover{background-position:-100px 0px;}.cboxSlideshow_on #cboxSlideshow{background-position:-125px 0px;right:27px;}.cboxSlideshow_on #cboxSlideshow.hover{background-position:-150px 0px;}.cboxSlideshow_off #cboxSlideshow{background-position:-150px -25px;right:27px;}.cboxSlideshow_off #cboxSlideshow.hover{background-position:-125px 0px;}#mdfb{font:12px/1.2 Arial,Helvetica,san-serif;color:#666;}#mdfb a,#mdfb a:hover,#mdfb a:visited{text-decoration:none;}.mdbox-title{background:#000;color:#fff;font-size:20px !important;font-weight:bold;margin:10px 0;border:20px solid #ddd;/*border-radius*/-webkit-border-radius:6px;-moz-border-radius:6px;border-radius:6px;/*box-shadow*/-webkit-box-shadow:5px 5px 5px #CCCCCC;-moz-box-shadow:5px 5px 5px #CCCCCC;box-shadow:5px 5px 5px #CCCCCC;padding:10px;line-height:25px;font-family:arial !important;}.mdbox-tagline{color:#999;margin:0;text-align:center;}#mdsubs-container{padding:35px 0 30px 0;position:relative;}a:link,a:visited{border:none;}.demo{display:none;}</style><script type='text/javascript'>jQuery(document).ready(function(){if (document.cookie.indexOf(&#39;visited=false&#39;) == -1) {var fifteenDays = 1000*60*60*24*30;var expires = new Date((new Date()).valueOf() + fifteenDays);document.cookie = &quot;visited=true;expires=&quot;+expires.toUTCString();$.colorbox({width:&quot;400px&quot;, inline:true, href:&quot;#mdfb&quot;});}});</script><div style='display:none'><div id='mdfb' style='padding:10px; background:#fff;'><center><iframe allowtransparency='true' frameborder='0' scrolling='no' src='//www.facebook.com/plugins/likebox.php?href=https%3A%2F%2Fwww.facebook.com%2Fhcvvn&amp;width=300&amp;colorscheme=light&amp;show_faces=true&amp;border_color=%23ffffff&amp;stream=false&amp;header=false&amp;height=258' style='border:none; overflow:hidden; width:300px; height:258px;'/></center> </div></div>

• Thay hcvvn  thành ID fan page của bạn. Ví dụ link fan page của mình là http://facebook.com/hcvvn thì id chính là hcvvn
• Thay false thành true nếu muốn cửa sổ chỉ xuất hiện trong lần đầu tiên truy cập blog của bạn

Bước 3: Lưu Mẫu template và thử vào blog của bạn để xem kết quả nào