SubscribeCara pembuatannya juga mudah, kalian hannya tinggal mengikuti langkah-langkah berikut :
(Sebaiknya kalian mem-back up terlebih dahulu template blog Anda)
Cara :
- Log in dengan account blogger anda
- pilih Tata Letak --> Edit HTML
- lalu beri centang pada kotak "Expand Widget Template"
- cari code <b:skin><![CDATA
- kemudian cari kode berikut dan letakkan di atas code <b:skin><![CDATA
<script src='http://sites.google.com/site/software2iqbalinc/javascript/script_ditunjuk_ngelipet_t4belajarblogger.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){
$("#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>
- lalu cari lagi code ]]></b:skin>
- letekkan kode berikut tepat di atas kode ]]></b:skin>
#pageflip {
position: relative;
}
#pageflip img {
border: none;
width: 50px; height: 52px;
z-index: 99;
position: absolute;
right: 0; top: 0;
-ms-interpolation-mode: bicubic;
}
#pageflip .msg_block {
width: 50px; height: 50px;
position: absolute;
right: 0; top: 0;
background: url(http://software2iqbal.files.wordpress.com/2009/11/berlangganan_kelipat.png) no-repeat right top;
text-indent: -9999px;
}
- Cari kode <body>
- letakkan kode berikut di bawah kode <body>
<div id='pageflip'>
<a href='http://feeds.feedburner.com/rexyxaverius' target='_blank'>
<img alt='' src='http://software2iqbal.files.wordpress.com/2009/11/gambar_kelipat.png'/>
<span class='msg_block'/>
</a>
</div>
(Ganti code yang berwarna merah dengan link yang Anda inginkan. Disarankan Link RSS atau link berlangganan)
- Save Template
Untuk mengatur gambar dindingnya atau backgroundnya , kalian ubah URL berikut dengan yang anda inginkan :
#pageflip .msg_block {
width: 50px; height: 50px;
position: absolute;
right: 0; top: 0;
background: url(http://software2iqbal.files.wordpress.com/2009/11/berlangganan_kelipat.png) no-repeat right top;
text-indent: -9999px;
}
*kalian juga bisa mengubah lebar dan panjang nya.
Selamat Mencoba
Sumber : Oktri.co.cc
2 comments:
PAge peel emang keren sob....
nice share and tutorial :)
salam kenal allshare zone
maaf gan ane mau tanya, kok ane kagak nemu yang tulisan body ya di edit HTML ?
Post a Comment