Silahkan sobat kreasikan sendiri gambarnya dan jika ingin membuat pageflip dengan tujuan halaman yang lain sobat tinggal ganti kode : <a href='http://feeds.feedburner.com/blog-zone' target='_blank'> dengan alamat url yang lain, misalnya alamat url untuk mengajak pengunjung blog menjadi referral sobat dalam suatu bisnis online yang sobat ikuti. 
Menjawab pertanyaan sobat Taufik pada komentarnya di postingan elegant style template, yang menanyakan cara membuat gambar di pojok kanan atas seperti kertas di lipat dan memasang feedburner di dalamnya. Mungkin maksudnya adalah cara membuat pageflip, semoga benar perkiraan saya.
Dan kebetulan saya belum pernah buat postingan ini, tidak ada salahnya kita bahas sama-sama, walaupun tutorial ini sudah basi dan usang. Buat yang belum tau apa itu pageflip, bisa melihat contoh demonya disini.
Gambar hidup yang dipojok kanan atas itulah yang disebut pageflip, jika disorot dengan mouse akan terbuka dan jika di klik akan menuju ke halaman yang dimaksud. Dan halaman yang dimaksud tersebut adalah feed kita yang sudah kita daftarkan di feedburner. Dibawah ini adalah 2 gambar yang akan kita gunakan untuk membuat pageflip.
Sebelumnya saya mohon maaf jika saya mengambil gambar pageflip ini tanpa seijin yang empunya. Karena saya sendiri tidak tau persis siapa yang mempunyai hak paten atas gambar pageflip ini, dan saya mengambilnya lewat search engine. Begitu saya lihat, sangat banyak gambar yang sama sehingga saya tidak tau dan tidak bisa mencantumkan sumber pemilik gambar yang asli.
Buat sobat blogger, ini tutorialnya semoga bermanfaat :
#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/_7Y9pl24WpQY/S1sO-qUjmxI/AAAAAAAACwU/DrjPrO1XXaU/page%20flip_thumb%5B1%5D.png) no-repeat right top; text-indent:-9999px }
<a href='http://feeds.feedburner.com/MyBloggerThemes' target='_blank'>
<img src='http://lh6.ggpht.com/_7Y9pl24WpQY/S1sO3NyCTSI/AAAAAAAACwM/6DxgJaTzsdc/page%20flip%20image_thumb%5B1%5D.png'/>
<span class='msg_block'/>
</a>
</div>
Semoga tutorial ini bisa bermanfaat, selamat mencoba !
|
Tweet
|
Berlangganan artikel terbaru via Email
|
12 comments
Pertamax.. Nice tutor sob. Saya pertama belum ngerti buat gituan Tapi sekarang jadi ngerti dikit. Makasi.
Mantab infonya. Makasi ya.
iyah sama-sama, jgn lupa mampir terus ke blog ini yah...awas ojo lali
haha ada2 aja nih si beben, makasih ben !
info menarik nih bagi pebisnis online...
ane cobain gan. sukses sih tapi pas step terakhir hasilnya posisi gambar jika codenya ditaruh setelah body berada terlalu dibawah. pertanyaan bagaimana agar gambar feednya berada di atas/posisi yg kita inginkan.thanks
bol jug (boleh juga)
info yang bermanfaat bagi para blogger, terus berinovasi di dunia blogger, di tunggu info yang lebih gresss
bos saya cari kode body diblogger koq gak ada??? gmn caranya bos??? terimakasih
ajib dah tips ini..thaks dah share
makasih bang infonya
wah caranya simple sekali ya,,mudah dan jelas..makasih,, bikin blog lebih keren nih,,,mantap
Posting Komentar