![]() |
| Contoh Page Peel |
Hmmm... Menarik bukan???
Langsung saja untuk mengetahui Cara Membuat Page Peel diBlogspot ( Cara membuat halaman blog melipat ).
1. Login ke akun blog Anda
2. Masuk ke tata letak dan klik edit HTML
3. Centang pada Expand Template Widget
4. Cari kode ini:
<b:skin><![CDATA[
( Untuk Lebih Mudahnya Tekan CTRL+F Untuk Mencarinya )
5. Copy script dibawah ini lalu letakan diatas kode tadi
<script src='http://dedehendriono.googlepages.com/jquery-latest.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>
6. Cari kode ini (Tekan CTRL+F)
]]></b:skin>
7. Letakan kode dibawah ini tepat diatas kode tadi
#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://dedehendriono.googlepages.com/subscribe.png) no-repeat right top;
text-indent: -9999px;
}
8. Cari kode ini
<body>
9. Letakan kode dibawah ini tepat dibawah kode tadi
<div id='pageflip'>
<a href='http://fadjarnugraha.blogspot.com/' target='_blank'>
<img alt='' src='http://dedehendriono.googlepages.com/pageflip.png'/>
<span class='msg_block'/>
</a>
</div>
Catatan : Yang berwarna Merah Anda bisa menggantinya . yang bertujuan untuk mengarahkan pengunjung Anda.

9 komentar:
Keren sob tutor nya. Thanks udah share :)
@Fajar345sama-sama
pertamaX agan sharenya. tutorial blogging lainnya ditunggu agan. :)
ok...thx dech to tutorialnya....,support u...,visit back ok....!!!!
gx da kode < body > sob . ...
@Yumna Nuruddin: Centang pada Expand Template Widget-nya dulu mas
udah di centang ,dri dlu kynya aku cri < body > gx da trus :D
ada cara lain gx slain taruh dibawah < body > gito?
bagus ni bisa diisi dengan iklan pasti akan menarik jadinya ya
Posting Komentar