Sau khi đọc bài viết Code Popup quảng cáo tổng hợp tại ITViet360 thì nhiều bạn có nhu cầu và hỏi thêm dạng code quảng cáo đứng hoặc trượt dọc 2 bên trang Web. Với code quảng cáo trượt dọc 2 bên Website sẽ gây được sự chú ý lớn.
Ở bài viết này ITViet360 sẽ giới thiệu với bạn 2 loại quảng cáo 2 bên được dùng thông dụng nhất hiện nay. Và cách thêm chúng như thế nào?
Đối với Blogspot
- Bạn chỉ cần dán code vào 1 tiện ích HTML/Javascript/
Đối với Website
- Bạn thêm code vào nằm trong thẻ <body> ... </body> là được
1. Code quản cáo đứng dọc cố định 2 bên trang Website.
<div id="left_ads_float">
<a href="
http://seophongvu.com" target="_blank"><img border="0" src="
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhsQH86xakOYO-ObLkeYsO-IenEC-FXb0vDfWP6CrhRSiscXsx8Cj7W0yBL7Q-ddAxVkDMEL9_qRTtHFB8zgDD3Bp-9HEEBUz-w1jLMj5CfuAbn0-f6rQHSemZWJ1aN_FnFYHT516uG5Y4r/s1600/banner-doc-web.jpg" width="170" /></a>
</div>
<div id="right_ads_float">
<a href="
http://seophongvu.com" target="_blank"><img border="0" src="
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhsQH86xakOYO-ObLkeYsO-IenEC-FXb0vDfWP6CrhRSiscXsx8Cj7W0yBL7Q-ddAxVkDMEL9_qRTtHFB8zgDD3Bp-9HEEBUz-w1jLMj5CfuAbn0-f6rQHSemZWJ1aN_FnFYHT516uG5Y4r/s1600/banner-doc-web.jpg" width="170" /></a>
</div>
<style>
#left_ads_float
{
bottom:20px;
left: 10px;
position:fixed; }
#right_ads_float
{
bottom:20px;
right: 10px;
position:fixed;
}
</style>
<script>
var vtlai_remove_fads=false;
function vtlai_check_adswidth()
{
if(vtlai_remove_fads)
{
document.getElementById('left_ads_float').style.display='none';
document.getElementById('right_ads_float').style.display='none';
return;
}else if(document.cookie.indexOf('vtlai_remove_float_ads')!=-1)
{
vtlai_remove_fads=true;
vtlai_check_adswidth();
return;
}
else
{
var lwidth=parseInt(document.body.clientWidth);
if(lwidth<1110)
{
document.getElementById('left_ads_float').style.display='none';
document.getElementById('right_ads_float').style.display='none';
}
else
{
document.getElementById('left_ads_float').style.display='block';
document.getElementById('right_ads_float').style.display='block';
}
setTimeout('vtlai_check_adswidth()',10);
}
}
</script>
2. Code quản cáo trượt dọc khi kéo thanh cuộn lên xuống.
2. Code quản cáo trượt dọc khi kéo thanh cuộn lên xuống.
Demo tại Blog: Công ty SEO uy tín
width="170" : chiều rộng của banner. Có 2 giá trị được đánh dấu màu cam
MainContentW = 1000 : chiều rộng trang web. Có 2 giá trị được đánh dấu cùng màu tím,
LeftAdjust = 5 : khoảng cách từ mép trái trang web đến banner
RightAdjust = 5 : khoảng cách từ mép phải trang web đến banner
TopAdjust = 10 : khoảng cách từ mép trên trang web đến banner
Read more: http://www.itviet360.com/2014/04/code-quang-cao-truot-doc-2-ben-web.html#ixzz3zfdB3cH5; word-wrap: break-word;">
<div id="divAdRight" style="DISPLAY: none; POSITION: absolute; TOP: 0px">
<a href="http://seophongvu.com" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhsQH86xakOYO-ObLkeYsO-IenEC-FXb0vDfWP6CrhRSiscXsx8Cj7W0yBL7Q-ddAxVkDMEL9_qRTtHFB8zgDD3Bp-9HEEBUz-w1jLMj5CfuAbn0-f6rQHSemZWJ1aN_FnFYHT516uG5Y4r/s1600/banner-doc-web.jpg" width="170" /></a>
</div>
<div id="divAdLeft" style="DISPLAY: none; POSITION: absolute; TOP: 0px">
<a href="http://seophongvu.com" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhsQH86xakOYO-ObLkeYsO-IenEC-FXb0vDfWP6CrhRSiscXsx8Cj7W0yBL7Q-ddAxVkDMEL9_qRTtHFB8zgDD3Bp-9HEEBUz-w1jLMj5CfuAbn0-f6rQHSemZWJ1aN_FnFYHT516uG5Y4r/s1600/banner-doc-web.jpg" width="170" /></a>
</div>
<script>
function FloatTopDiv()
{
startLX = ((document.body.clientWidth -MainContentW)/2)-LeftBannerW-LeftAdjust , startLY = TopAdjust+80;
startRX = ((document.body.clientWidth -MainContentW)/2)+MainContentW+RightAdjust , startRY = TopAdjust+80;
var d = document;
function ml(id)
{
var el=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id];
el.sP=function(x,y){this.style.left=x + 'px';this.style.top=y + 'px';};
el.x = startRX;
el.y = startRY;
return el;
}
function m2(id)
{
var e2=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id];
e2.sP=function(x,y){this.style.left=x + 'px';this.style.top=y + 'px';};
e2.x = startLX;
e2.y = startLY;
return e2;
}
window.stayTopLeft=function()
{
if (document.documentElement && document.documentElement.scrollTop)
var pY = document.documentElement.scrollTop;
else if (document.body)
var pY = document.body.scrollTop;
if (document.body.scrollTop > 30){startLY = 3;startRY = 3;} else {startLY = TopAdjust;startRY = TopAdjust;};
ftlObj.y += (pY+startRY-ftlObj.y)/16;
ftlObj.sP(ftlObj.x, ftlObj.y);
ftlObj2.y += (pY+startLY-ftlObj2.y)/16;
ftlObj2.sP(ftlObj2.x, ftlObj2.y);
setTimeout("stayTopLeft()", 1);
}
ftlObj = ml("divAdRight");
//stayTopLeft();
ftlObj2 = m2("divAdLeft");
stayTopLeft();
}
function ShowAdDiv()
{
var objAdDivRight = document.getElementById("divAdRight");
var objAdDivLeft = document.getElementById("divAdLeft");
if (document.body.clientWidth < 1000)
{
objAdDivRight.style.display = "none";
objAdDivLeft.style.display = "none";
}
else
{
objAdDivRight.style.display = "block";
objAdDivLeft.style.display = "block";
FloatTopDiv();
}
}
</script>
<script>
document.write("<script type='text/javascript' language='javascript'>MainContentW = 1000;LeftBannerW = 125;RightBannerW = 125;LeftAdjust = 5;RightAdjust = 5;TopAdjust = 10;ShowAdDiv();window.onresize=ShowAdDiv;;<\/script>");
</script>
width="170" : chiều rộng của banner. Có 2 giá trị được đánh dấu màu cam
MainContentW = 1000 : chiều rộng trang web. Có 2 giá trị được đánh dấu cùng màu tím,
LeftAdjust = 5 : khoảng cách từ mép trái trang web đến banner
RightAdjust = 5 : khoảng cách từ mép phải trang web đến banner
TopAdjust = 10 : khoảng cách từ mép trên trang web đến banner
