Tips Membuat Page Peel Effect Blog | Halaman Blog Bisa Melipat

Tips Membuat Page Peel Effect Blog | Halaman Blog Bisa Melipat oleh Tips Hereisanswer 
Yups seperti judulnya kalau di translate dari bahasa inggris sih Page Peel diartikan juga sebagai Halaman Terkelupas.Lucu ya namanya tapi kalau tutorial Blog atau Tips dan Trik blog ini diterapin di Blog kita maka tampilannya bakalan Cool.Tips dan Trik ini pada intinya adalah agar Halaman Blog bisa melipat layaknya seperti buku tulis. Nih Screenshotnya Sobat Tips Hereisanswer.

Tips Membuat Page Peel Effect Blog,Halaman Blog Bisa Melipat,page peel

TIPS MEMBUAT PAGE PEEL EFFECT BLOG


1. Login ke Blogger.
2. Pada halaman Dasbor, kita pilih Template.
3. Kemudian pilih Edit HTML
4. Beri tanda centang pada Expand Template Widget
5. Cari kode <b:skin><![CDATA[ letakkan kode berikut di atasnya
<script src='http://code.jquery.com/jquery-latest.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){
//Page Flip on hover
$(&quot;#pageflip&quot;).hover(function() {
$(&quot;#pageflip img , .msg_block&quot;).stop()
.animate({
width: &#39;307px&#39;,
height: &#39;319px&#39;
}, 500);
} , function() {
$(&quot;#pageflip img&quot;).stop()
.animate({
width: &#39;50px&#39;,
height: &#39;52px&#39;
}, 220);
$(&quot;.msg_block&quot;).stop()
.animate({
width: &#39;50px&#39;,
height: &#39;50px&#39;
}, 200);
});
});
</script>

6. Cari kode berikutnya ]]></b:skin>, letakkan kode berikut di atasnya
#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(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkQ6UNGDokZEGwY_M-wFaParz676LVXAc6UwUu7OSdWOudtWXKTB_unMqbfj5sQpTMRdM0KovQzvUHB2cppCh8cxerFNPbMV6MwmS-AIFlP8h8kqilNaeUy5HrouI0a5bblaofaEHnaOKF/s1600/subscribe+hereisanswer.blogspot.com.png) no-repeat right top;
}

7. Cari kode <body> dan lettakkan kode berikut di bawahnya
<div id='pageflip'>
<a href='http://feeds2.feedburner.com/namafeedkamu' target='_blank' >
<img alt='' src='http://img224.imageshack.us/img224/8315/pageflip.png'/>
<span class='msg_block'/>
</a>
</div>

  • NB: http://feeds2.feedburner.com/namafeedkamu ganti dengan feed blog kamu

8. Klik Pratinjau untuk melihat berhasil atau tidak
9. Jika sudah berhasil dan selesai, Klik Simpan/Save.

Mudah bukan menerapkan Tips Hereisanswer yang berjudul Tips Membuat Page Peel Effect Blog | Halaman Blog Bisa Melipat di FB kalian.Jangan lupa comment dan di share ya.Terimakasih telah membaca Tips Hereisanswer yang berjudul Tips Membuat Page Peel Effect Blog | Halaman Blog Bisa Melipat.Semoga tips yang blog ini berikan bermanfaat untuk anda. Jangan lupa membaca tips lainya di blog ini.Selanjutnya  Tips Hereisanswer akan memberikan tips yang berjudul Tips dan Trik Berpergian Ke Luar Negeri