Code quảng cáo Popup cho Blogspot ở góc màn hình

Hướng dẫn cách chèn khung quảng cáo popup hay thông báo luôn dưới góc phải (trái) màn hình dành cho Blogger/ Blogspot. Khung quảng cáo sẽ trượt lên và mở của sổ quảng cáo nhỏ dưới góc màn hình khi load trang và có thể ẩn hiển tùy ý.

Quảng cáo dưới góc màn hình cho blogspot

Live Demo

Cách chèn khung quảng cáo dưới góc màn hình cho Blogger/ Blogspot

Tạo một widget mới để chèn code quảng cáo popup

Rất đơn giản, các bạn chỉ cần vào công cụ quản trị Blogger, "Bố cục", thêm Widget (Tiện ích) mới, chọn tiện ích HTML/Javascript.

- Để trống tiêu đề Widget.
- Copy toàn bộ đoạn code dưới đây cho vào phần nội dung của Widget:

 Hot: Bán cho thuê căn hộ cao cấp Thảo Điền Pearl

 
<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(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgq66QzDaupp4Rw21n6sHpchNeOg94ym6Zs009-UV7X4w0GNWioRbZTLQxP9q9K77QyGWSlPBKEY7r5IoNbkm18_n8-FrjdwpNb_6IH-75Td5uiFjGzDz-ORtgGi0NEPg-Vy9DRewkGqb5Y/w15-h150-no/cuocsongmuonmau.info_bg_right.gif) no-repeat right top;}    
 #cob263512{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzlI1zgsdtMgUXne7e07z-lyj9XFquJFQjptHzseuzF3suqc0GnDoLANXtd04uIfocSZwjGcl70W4dd0Ei0R1nRIaNG7JZOW8hIoG7EyYw9a5rXsFwuuqAacBGmpYDKGwbaalSYiM-2p1K/w501-h150-no/cuocsongmuonmau.info_bg.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(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZkTRiWWJK9gDjQeYoBracy3ibMjXT44vstTA4TTIOAAxb1HsRnQBmA5u5iVDZHLLEMZAbx8MdNvb9PvsnFlLmAWDxmZDvvIyO1nIlFhIGmtOG4Yt29CY9dg1k-DQgUzYV4BeAhh1tfUWv/w90-h30-no/cuocsongmuonmau.info_button.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="Ẩn  đi">Ẩn</a></li>    
  <li id="pf204652show" style="display: none;"><a class="max" href="javascript:pf204652clickshow();" title="Hiện  lại">Xem </a></li>    
 </ul>    
 &nbsp;Hot: Bán cho thuê căn hộ cao cấp Thảo Điền Pearl
 </div>    
 <div id="co453569">
<!-- code ads -->    
<a target="_blank" href="http://www.canhothuehcm.com/2013/10/ban-cho-thue-can-ho-cao-cap-thao-dien-pearl.html"> <img style="margin:3px 1px 1px 3px;" border="0" width="264" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEha8OoHFS3A4qsCIxZZFqMlSQFuufr0vBb21rAP7LvrMu2LK6D3p_iQv8p-P4Mnuc10pKOAqr77PhIAorl3z43_Zw7lllP6LiUaFxChYWPTVs3hLHCBwtjhrK91A4CDiqoCmlDQIIYvJDXI/w264-h115-no/1.jpg" height="115" title="Dự án mới | Căn hộ cao cấp Thảo Điền Pearl"></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>