Blogger’da, yan tarafa normal reklam resmi koymak yerine, değişikreklam şekilleri oluşturabilirsiniz. İşte o yollardan birini anlatmak istiyorum. Bir çok blogda görmüşsünüzdür; Yan tarafta üzerine gidince açılan reklam sayfasını. İşte bizler de bunu blogger için kullanacağız. Fakat isterseniz, elbette reklam sayfasını, RSS linkinizi koyarakta kullanabilirsiniz. Gerçekten çok kullanışlı ve blogunuzungörselleşmesi açısından güzel bir eklenti olduğunu düşünüyorum.
Öncelikle aşağıdaki kodu buluyoruz;
]]></b:skin>
Yukarıdaki koddan önce, aşağıdaki kodları ekliyoruz;
#pageflip {
position: relative;
right: 0; top: 0;
float: right;
}
#pageflip img {
width: 50px; height: 52px;
z-index: 99;
position: absolute;
right: 0; top: 0;
-ms-interpolation-mode: bicubic;
}
#pageflip .msg_block {
width: 50px; height: 50px;
overflow: hidden;
position: absolute;
right: 0; top: 0;
background: url(http://reklamresmininlinki) no-repeat right top;
}
Sonra ise, aşağıdaki kodu bulalım;
</head>
Yukarıdaki koddan sonra, aşağıdaki kodları ekliyoruz;
<script src='http://code.jquery.com/jquery-latest.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){
//Page Flip on hover
$("#pageflip").hover(function() {
$("#pageflip img , .msg_block").stop()
.animate({
width: '307px',
height: '319px'
}, 500);
} , function() {
$("#pageflip img").stop()
.animate({
width: '50px',
height: '52px'
}, 220);
$(".msg_block").stop()
.animate({
width: '50px',
height: '50px'
}, 200);
});
});
</script>
Son olarak aşağıdaki kodu buluyoruz;
<body>
Ve yukarıdaki koddan sonra aşağıdaki kodları ekliyoruz;
<div id='pageflip'>
<a href='http://reklamlinki'>
<img alt='' src='http://img224.imageshack.us/img224/8315/pageflip.png'/>
<span class='msg_block'/>
</a>
</div>
Not: Yukarıda yer alan kırmızı alanları, kendi blogunuza göre düzenlemeyi unutmayınız.
Örnek Görüntü;
Eklenti karşımıza ilk olarak aşağıdaki gibi çıkıyor;
Yukarıdaki sayfaya gelince ise, sayfa aralanıyor;
Sayfa aralandıktan sonra çıkan beyaz kısımda da, reklam resmi yer alacak.
Yorumlarınızla Katkıda Bulunun
Hiç yorum yok
Yorum Gönder