Ziyaretçilerinizin ilgisini nasıl çekersiniz ?

1ggx4i63 1
smiley, gülen yüz

  Ziyaretçilerinizin ilgisini nasıl çekersiniz ? 
-Reklam ekleyerek. Peki tekdüze bir reklam eklemek mi veya izleyici’nin ilgisini çekebilecek bir reklam mı ?
İkinci ise yazımızı okumaya devam etmelisiniz 🙂
Blogger’a reklam konusunda bir navbar şeklinde reklam ekleyeceğiz. Bu da okuyucu’nun ilgisini çekecek.
1.Adım :Şimdi sizlere göstereceğimiz yolu sırası ile izleyiniz. Tasarım > Sayfa Ögeleri > HTML’yi Düzenle
Şimdi aşağıdaki kodu bularak yolumuza devam ediyoruz ;
]]></b:skin>
Aaşağıda verilen kodu yukarıda verdiğimiz ]]></b:skin> kodundan önce ekliyoruz.
#mta_bar {
background:#003366;
border-top: 3px solid #6699ff;
margin: 0;
padding: 7px 0;
z-index: 100;
top:0px;
right:0px;
width: 100%;
overflow: auto;
position: fixed;
}
* html #mta_bar{
/*IE6 hack*/
position: absolute;
width: expression(document.compatMode==”CSS1Compat”? document.documentElement.clientWidth+”px” : body.clientWidth+”px”);
}
#mta_bar .left {
float: left;
text-align: center;
font-family: Arial;
font-size: 13px;
font-weight: bold;
font-style: normal;
color: #0000FF;
width:92%;
}
#mta_bar .right {
font-family: Arial, Helvetica, sans-serif;
float: right;
text-align: center;
font-weight: normal;
font-size: 10px;
letter-spacing: 0;
width: 30px;
white-space: nowrap;
}
#mta_bar .right a {
font-size: 10px;
color: #0000FF;
text-decoration: underline;
}
#mta_bar .right a:hover {
font-size: 10px;
color: #0000FF;
text-decoration: none;
}
#left_bar a {
text-decoration: none;
color: #fff;
padding:5px 0px 5px 30px;
}
#left_bar a:hover {
text-decoration: underline;
color: #fff;
}
Şimdi sıra geldi </head> kodunu bulmaya aşağıdaki kodu bulunuz.
</head>
Şimdi de aşağıda görülen kodu yukarıdaki kodumuzdan hemen önceye ekliyoruz.
<script type=’text/javascript’>
//<![CDATA[
var mta_arr = new Array();
var mta_clear = new Array();
function mtaFloat(mta) {
mta_arr[mta_arr.length] = this;
var mtapointer = eval(mta_arr.length-1);
this.pagetop = 0;
this.cmode = (document.compatMode && document.compatMode!=”BackCompat”) ? document.documentElement : document.body;
this.mtasrc = document.all? document.all[mta] : document.getElementById(mta);
this.mtasrc.height = this.mtasrc.offsetHeight;
this.mtaheight = this.cmode.clientHeight;
this.mtaoffset = mtaGetOffsetY(mta_arr[mtapointer]);
var mtabar = ‘mta_clear[‘+mtapointer+’] = setInterval(“mtaFloatInit(mta_arr[‘+mtapointer+’])”,1);’;
mtabar = mtabar;
eval(mtabar);
}
function mtaGetOffsetY(mta) {
var mtaTotOffset = parseInt(mta.mtasrc.offsetTop);
var parentOffset = mta.mtasrc.offsetParent;
while ( parentOffset != null ) {
mtaTotOffset += parentOffset.offsetTop;
parentOffset = parentOffset.offsetParent;
}
return mtaTotOffset;
}
function mtaFloatInit(mta) {
mta.pagetop = mta.cmode.scrollTop;
mta.mtasrc.style.top = mta.pagetop – mta.mtaoffset + “px”;
}
function closeTopAds() {
document.getElementById(“mta_bar”).style.visibility = “hidden”;
}
//]]>
</script>
Artık son adıma geldik. (Çok uzun değil, devam edin.. 🙂
Aşağıdaki kodu buluyoruz.
</body>
Şimdi de aşağıdaki kodları yukarıdaki koddan önce ekliyoruz.
<div id=’mta_bar’>
<div id=’left_bar’>
<span class=’left’>
<a href=’Reklamlinkiniz’ target=’_blank’>Reklam’ın gideceği link ile ilgili yazı..</a></span></div>
<span class=’right’ onmouseout=’self.status=&apos;&apos;’ onmouseover=’self.status=&apos;siteadresiniz.com&apos;;return true;’>
<img align=’absmiddle’ border=’0′ onClick=’closeTopAds();return false;’ src=’http://lh5.ggpht.com/_pt7i0nbIOCY/SRGg-N2bQ4I/AAAAAAAAAVE/pG-pTLXsMtc/close_thumb%5B1%5D.png?imgmax=800′ style=’cursor:hand;cursor:pointer;’/>
</span>
</div>
Mavi kısımları kendinize göre düzenleyebilirsiniz.
Kaynak: http://www.anshuldudeja.com/2009/04/how-make-and-add-stripe-ads-in-blogger.html