Blogger Note

Article :

Posts RSS dengan PageFlip

Pada Tutorial sebelumnya saya sudah menerangkan Cara Membuat Ads Pop Up Dengan JQuery, akan tetapi pada tutorial hari ini saya akan share tentang Modifikasi Blog, yaitu tidak lain lagi adalah Posts RSS dengan PageFlip,Trik ini biasanya digunakan untuk menghemat tempat karena kita bisa menyisipkan Posts Rss,  diheader kita,dengan begitu kita bisa menghemat tempat + mempercantik blog, jadi kesimpulannya jika sobat menggunakan trik ini sobat juga mendapat  keuntungan yang berganda, untuk demonya sobat bisa klik disini, bagaimana menurut sobat indah bukan, bagaimana jika hal itu terjadi pada blog sobat?, yang pasti akan terlihat indah di pandang, ok langsung saja tutorialnya dibawah ini.

  • Login ke blogger >> Tata Letak >> Edit HTML >> Expand widget template
  • Cari kode <b:skin><![CDATA[
  • dan letakkan kode berikut di atasnya:
<script src='http://yourjavascript.com/100718417/lipatan_header.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 kode ]]></b:skin>
  • Dan letakkan kode berikut tepat di atasnya: 

#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://lh5.ggpht.com/_RVpTV2JOOxA/S8iu18jZiCI/AAAAAAAACyo/e0oaiHtbMf0/berlangganan_kelipat.png) no-repeat right top;
text-indent: -9999px;
  • Cari kode <body>
  • Dan lettakkan kode berikut di bawahnya: 
<div id='pageflip'>
<a href='http://feeds.feedburner.com/MusaKhairulUmam' target='_blank'>
<img alt='' src='http://lh3.ggpht.com/_RVpTV2JOOxA/S8iu2CHC7SI/AAAAAAAACys/nYe088a8tkc/gambar_kelipat.png'/>
<span class='msg_block'/>
</a>
</div>
  • Simpan
NOTE:Ganti yang berwarna HIJAU dengan Link yang anda inginkan. Saran: Link RSS
 

4 comments:

25 Juli 2011 07.05

tampilanny kayak buku seperti lembaran?

28 Juli 2011 01.55

iya kayak komentator diatas :D mirip selembaran kertas :D

28 Juli 2011 03.00

To Asmara Susanto:Iya sob tampilannya memang kayak gitu

To Farixsantips:ada-ada aja sobat wkwkwk :D

10 Juli 2013 21.14

Wah link hidup.. SPAM

Posting Komentar