Thủ thuật tạo Popup quảng cáo hiện lên góc phải Blogger

Được đăng bởi trung  |  lúc  04:22 0 Nhận xét

Thủ thuật blogger cách tạo banner quảng cáo hiển thị dạng popup ở góc màn hình. Với mẫu này độc giả có thể bấm nút để ẩn hiện popup theo ý của độc giả, nghĩa là khi độc giả truy cập vào trang của bạn thì popup này sẽ hiện ra (show) và người dùng có thể bấm vào nút ẩn để ẩn nó đi nếu họ không thích.

1. Vào Bố cục (layout) 

2. Chọn Thêm tiện ích => Tạo một widget HTML\JavaScripts và chèn code bên dưới vào đó:

<style type="text/css">      
 * html div#fl813691 {position: absolute; overflow:hidden;      
 top:expression(eval(document.compatMode &&      
 document.compatMode=='CSS1Compat') ?      
 documentElement.scrollTop      
 +(documentElement.clientHeight-this.clientHeight)      
 : document.body.scrollTop      
 +(document.body.clientHeight-this.clientHeight));}      
  #fl813691{font: 12px Arial, Helvetica, sans-serif; color:#666;  position:fixed; _position: absolute; right:0; bottom:0; height:150px; }       
 #eb951855{ width:279px; padding-right:7px; background:url(http://3.bp.blogspot.com/-pjTpLDeCS8I/Uas87l_nF0I/AAAAAAAADWM/EycEXhv_mhw/s1600/rightp.gif) no-repeat right top;}      
 #cob263512{background:url(http://2.bp.blogspot.com/-eykde4kjuGM/Uas9FM1ijfI/AAAAAAAADWU/IJ6hHuu6pNU/s1600/fulld.gif) no-repeat left top; height:150px; padding-left:7px;}      
 #coh963846{color:#690;display:block; height:20px; line-height:20px; font-size:11px; width:277px;}      
 #coh963846 a{color:#690;text-decoration:none;}      
 #coc67178{float:right; padding:0; margin:0; list-style:none; overflow:hidden; height:15px;}      
 #coc67178 li{display:inline;}      
 #coc67178 li a{background-image:url(http://2.bp.blogspot.com/-91xti1kHuts/Uas9N_aBAYI/AAAAAAAADWc/s5DbPY-R7EQ/s1600/closebutton.gif); background-repeat:no-repeat; width:30px; height:0; padding-top:15px; overflow:hidden; float:left;}      
 #coc67178 li a.close{background-position: 0 0;}      
 #coc67178 li a.close:hover{background-position: 0 -15px;}      
 #coc67178 li a.min{background-position: -30px 0;}      
 #coc67178 li a.min:hover{background-position: -30px -15px;}      
 #coc67178 li a.max{background-position: -60px 0;}      
 #coc67178 li a.max:hover{background-position: -60px -15px;}      
  #co453569{display:block; margin:0; padding:0; height:123px;  border-style:solid; border-width:1px; border-color:#111 #999 #999 #111;  line-height:1.6em; overflow:hidden;}      
 </style>       
 <div id="fl813691" style="height: 152px;">       
 <div id="eb951855">       
 <div id="cob263512">       
 <div id="coh963846">       
 <ul id="coc67178">       
  <li id="pf204652hide"><a class="min"  href="javascript:pf204652clickhide();" title="&#7848;n  &#273;i">&#7848;n</a></li>       
  <li id="pf204652show" style="display: none;"><a class="max"  href="javascript:pf204652clickshow();" title="Hi&#7879;n  l&#7841;i">Xem </a></li>       
 </ul>       
 &nbsp;Thiết Kế Blogger
 </div>       
 <div id="co453569"> 
<!-- code ads -->       
<a target="_blank" href="http://www.thietkeblogger.net/" rel="nofollow"> <img style="margin:3px 1px 1px 3px;" border="0" width="264" src="http://2.bp.blogspot.com/-RHnOQWB9Kh4/Uas9tZnr3VI/AAAAAAAADWk/QLtPd3ZtyvI/s1600/thu+thuat+blogger.jpg" height="115" title="Namkna | Kiến thức - Giải Trí - Thủ thuật - Giải pháp công nghệ"/></a>       
<!-- code ads -->       
 
</div>      
 </div></div></div>       
 <script>       
 pf204652bottomLayer = document.getElementById('fl813691');      
 var pf204652IntervalId = 0;      
 var pf204652maxHeight = 150;//Chieu cao khung quang cao      
 var pf204652minHeight = 20;      
 var pf204652curHeight = 0;      
 function pf204652show( ){      
 pf204652curHeight += 2;      
 if (pf204652curHeight > pf204652maxHeight){      
 clearInterval ( pf204652IntervalId );      
 }      
 pf204652bottomLayer.style.height = pf204652curHeight+'px';      
 }      
 function pf204652hide( ){      
 pf204652curHeight -= 3;      
 if (pf204652curHeight < pf204652minHeight){      
 clearInterval ( pf204652IntervalId );      
 }      
 pf204652bottomLayer.style.height = pf204652curHeight+'px';      
 }      
 pf204652IntervalId = setInterval ( 'pf204652show()', 5 );      
 function pf204652clickhide(){      
 document.getElementById('pf204652hide').style.display='none';      
 document.getElementById('pf204652show').style.display='inline';      
 pf204652IntervalId = setInterval ( 'pf204652hide()', 5 );      
 }      
 function pf204652clickshow(){      
 document.getElementById('pf204652hide').style.display='inline';      
 document.getElementById('pf204652show').style.display='none';      
 pf204652IntervalId = setInterval ( 'pf204652show()', 5 );      
 }      
 function pf204652clickclose(){      
 document.body.style.marginBottom = '0px';      
 pf204652bottomLayer.style.display = 'none';      
 }      
 </script>

Thiết Kế Blogger : tiêu đề khung quảng cáohttp://www.thietkeblogger.net/ : liên kết đến website nhà quảng cáohttp://2.bp.blogspot.com/-RHnOQWB9Kh4/Uas9tZnr3VI/AAAAAAAADWk/QLtPd3ZtyvI/s1600/thu+thuat+blogger.jpg 
Để khung popup hiện bên trái thì bạn thay chữ ringht:0 thành left:0