Cách thêm banner quảng cáo 2 góc phải và trái website

Thường khi các bạn vào một website hay một blogspot sẽ thấy có một quảng cáo hoặc mục hỗ trợ support từ từ hiện lên ở góc trái hoặc góc phải website, và có nút ẩn đi hoặc hiện lên, hôm nay mình hướng dẫnCách thêm banner quảng cáo 2 góc phải và trái website.

Demo  banner quảng cáo 2 góc phải và trái website

Live Demo

Cách làm: (áp dụng được cả blogspot và website )
Đăng nhập => Bố cục => Thêm tiện ích HTML/Javacript => Paste đoạn code sau vào: <style type="text/css">
* html div#share123_ads {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));}
#share123_ads{font: 12px Arial, Helvetica, sans-serif; color:#666; position:fixed; _position: absolute; left:0; bottom:0; height:150px; }
#share123_bg{ width:279px; padding-right:7px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHcTbqY99GOt5R-qoNFmkYOUBXkikO_Es0u9zB4Z2LjK_kvG-k1a2tZbdJesvguFGBx3xUezxQMoMoAS1-q_tAew2A-MNLK21isWqsW73du_yNC3S1ZIABG0_G9IhGIa78ymbohZnfKlY/s1600/rightp_1.png) no-repeat right top;}
#cob263512{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhXJzIqSc-94z8l8zVejaBz4B1Az9f7NXTE3BM5PzgHn05HyOdqOOua7SccO8nMRKUd-d3c5y6Ia9HnesXINTkc7Cte4AnbvYw6eaiC-Oe7KLfBfVsM5lUNqK5-NM7H3qdWIvExhkR03Xc/s1600/full1d.gif) no-repeat left top; height:150px; padding-left:7px;}
#share123_ads_head{color:#fff;display:block; height:20px; line-height:20px; font-size:12px; width:277px;}
#share123_ads_head a{color:#690;text-decoration:none;}
#share123_ads_view{float:right; padding:0; margin:0; list-style:none; overflow:hidden; height:15px;}
#share123_ads_view li{display:inline;}
#share123_ads_view li a{background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEivwvhN9whI6kVMagljh8Cku1Y0UolEBgm_oersCkhRL9IO9QUvusady06x4nJ3cjJu7z4OUlBf_bLMbQSxTHr3OdD67yHMI5YUDBSyG41jWhS0Pje9b4ckOxKtEgbZmf7_sx1BKuHTf1Q/s1600/closebutton.gif); background-repeat:no-repeat; width:30px; height:0; padding-top:15px; overflow:hidden; float:left;}
#share123_ads_view li a.close{background-position: 0 0;}
#share123_ads_view li a.close:hover{background-position: 0 -15px;}
#share123_ads_view li a.min{background-position: -30px 0;}
#share123_ads_view li a.min:hover{background-position: -30px -15px;}
#share123_ads_view li a.max{background-position: -60px 0;}
#share123_ads_view 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="share123_ads" style="height: 152px;">
<div id="share123_bg">
<div id="cob263512">
<div id="share123_ads_head">
<ul id="share123_ads_view">
<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;Hỗ trợ trực tuyến từ Share123.vn
</div>
<div id="co453569">
<!-- code ads -->
<a target="_blank" href="http://share123.vn" rel="dofollow"> <img style="margin:3px 1px 1px 3px;" border="0" width="260" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhArf-wZFkay6R0t2NFCD8EYO343zUvSp7Sb40pcP2FuOBdTZNm5LhQ6DIJ5tyIrM8UBK273DpJfwcrK607l7Py_uAJ8Vz5ny0l02aAAt7uzsYP6xc2DYWMsvnavNlhvI7hL5JyPsTsnhA/s320/logo.png" height="115" title="http://share123.vn"/></a>
<!-- code ads -->
</div>
</div></div></div>
<script>
pf204652bottomLayer = document.getElementById('share123_ads');
var pf204652IntervalId = 0;
var pf204652maxHeight = 148;//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>

Các bạn chú ý:

 - Thay textlink http://share123.vn thành link blog, website của bạn 

- Thay ảnh https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhArf-wZFkay6R0t2NFCD8EYO343zUvSp7Sb40pcP2FuOBdTZNm5LhQ6DIJ5tyIrM8UBK273DpJfwcrK607l7Py_uAJ8Vz5ny0l02aAAt7uzsYP6xc2DYWMsvnavNlhvI7hL5JyPsTsnhA/s320/logo.png bằng ảnh cần hiển thị của bạn

- Nếu muốn banner hiển thị sang phải thì thay giá trị left:0;  thành right:0 là được.

Share123.vn Chúc bạn thành công

• Hướng dẫn tạo popup quảng cáo giữa màn hình website, blog
• Code quảng cáo dọc 2 bên website
• Tổng hợp các Code tạo quảng cáo Popup cho Blogspot
• Adblock Plus - Cách chặn quảng cáo khi đang xem phim hoặc lướt web

Thiết kế Web SEO