Thiết kế blogspot đẹp, theme bloggger đẹp, zip blogspot chuyên nghiệp

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/AVvXsEiuk_YRJcJk-Oo0hlG0IkEHl6Vrq7nJbjXeUhhZ41zTb6CjeWt50oAZ_SaIA2LY63ghYX1XPRuy6MX9cPl0hTNiILZ4afkJGalAkVHTNx6ou6ROfmIJkHkY196oVfGcNQgEJN0L05KRLZ0/s1600/rightp_1.png) no-repeat right top;}
#cob263512{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiCYrAIB8UC9yq92Oeeh2quH7rqoLueC9dQCK3G20O9CbIqCx0u39ehyEwApw-7cQW_9cElQzEEfgf0ZrutDviKJ6j86ImS2_IG38Y_pO7MdJQvniE08Cstz2tKUp7_FaXatj-ZyF6eorE/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/AVvXsEgU6btPsMqB_Uz2mlzPfhPpn11QDYia21dJhIQEjSJALb9qb9hAUxkrMlV9dZmDQGYnyMsaXy8Iq0xNPLPMKY3GsgRcYTTM7R_TSZuGld8eOliYMZNHKRIpY82nxXWKOaOl5EhoBd9kJtY/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/AVvXsEhWKatK7FC5BXlE56X3Q7vaUiRGLpP5ZjWTzk9buCasKpypmeGRG1lPVC_phJGcx3QQs8VP4sZYM5ObrcpEKWfpglxdBnyb2XAUjmordgJHvfsvvKGIMg_IgUzFwOu28a6pPLfUjJ6Z6-c/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>