TẠO QUẢNG CÁO DẠNG NỔI, CÓ NÚT ĐÓNG, THIẾT KẾ RESPONSIVE Ở CHÂN TRANG CHO BLOGGER/BLOGSPOT

Bạn đã bao giờ nhìn thấy một banner quảng cáo lơ lửng dưới trang web? Bây giờ chúng ta sẽ tạo ra các quảng cáo dạng nổi trong chân trang của blog nhé. Khi mở blog, banner quảng cáo sẽ ngay lập tức xuất hiện trong chân trang của blog và tiếp tục hiện khi bạn kéo thanh scrollbar lên xuống. Có một nút đóng để tắt cho những người không thích quảng cáo.

Tạo quảng cáo dạng nổi có nút đóng thiết kế responsive ở chân trang cho Blogger/Blogspot

Rất đơn giản bạn chỉ cần vào Bố cục >> thêm tiện ích HTML/JavaScript và thêm vào dòng code bên dưới.

<!-- ADS FOOTER  BY IRIS-TIPS.BLOGSPOT.COM-->
<script type='text/javascript'>
$(document).ready(function() {
$('img#closedb').click(function(){
$('#btm_banner').hide(90);
});
});
</script>
<style type='text/css'>
div#btm_banner {
bottom: 0;
position: fixed;
width: 80%;
opacity: 0.9;
left: 10%;
}
div#btm_banner img{
border:0;
cursor:pointer;
}
</style>
<div style='height: 0px;'></div>
<div align='center' id='btm_banner' style='height: 17%; z-index: 9999;'>
<div style='text-align: right; width: 100%; height:5px;'>
<img id='closedb' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgZWyXABNwTLzg_HgKAc-oJl39gxuen_1VTm3Uh4pA_qWCa1mywZgo5NAJjf5xVGm2mhfLIfypKu7bFAwDn6fmoGrKrdn28_S53HYY5LxK-XTR98DRiS9RwAb6MdzyrSqvPuuyemgCubRg/s1600/exit.png'/></div>
<div style='clear: both;'></div>
<p>
<p><center>
<!-- ADVERTISING CODE -->


ADVERTISING CODE HERE


<!-- ADVERTISING CODE -->
</center></p>
</p>
</div>
<!-- ADS FOOTER  BY IRIS-TIPS.BLOGSPOT.COM-->

Điều chỉnh width: 80%; left: 10%; opacity: 0.9; (độ trong suốt của banner, chọn 1 nếu không muốn trong suốt); height: 17%; cho phù hợp với website của bạn.

DEMO TẠI TRANG BÀI VIẾT NÀY.

Nguồn: IRIS-TIPS