2/11/2013

Cara Membuat Widget Entri Populer Menjadi Animasi Gambar Berputar


entri populer dengan tampilan gambar berputar dan membesar
Hai sobat blogger, kali ini saya mendapatkan ilmu baru dari sebuah blog. Sebagai informasi, widget entri populer adalah sebuah widget yang dibuat oleh Blogger(Google), gunanya untuk mempermudah pengunjung untuk memilih sebuah entri (artikel) yang enak untuk dibaca, karena semakin banyak orang yang mempelajari ilmu blogger, muculah sebuah java script yang membuat gambar berputar jika di sentuh oleh mouse, dan java script ini dipergunakan untuk entri populer, guna java script ini hanya untuk membuat widget tersebut lebih menarik, karena orang itu memberitahukan ke blog, maka semua orang-pun tahu cara membuat entri populer menjadi menarik, mungkin anda sudah pernah melihat widget seperti gambar di atas, pasti anda sudah pernah, ada dua faktor anda sudah melihat widget tersebut, anda memakai widget tersebut, atau anda melihat gambar di atas.

Nah anda sudah tahu kan tentang widget entri populer, sekarang kita akan membahas cara membuat widget entri populer menjadi lebih menarik.

1. Masuk ke Dasbor
2. Pilih Template
fitur entri populer animasi di blogspot
3. Klik Edit HTML
cara membuat entri populer menjadi lebih menarik
4. Klik Lanjutkan
cara memodifikasi entri populer menjadi gallery style
5. Centang Expand Template Widget
cara menambah entri populer di blog
6. Cari kode di bawah ini (Gunakan CTRL+F untuk mempermudah pencarian)
]]></b:skin>
7. Copy kode di bawah ini, lalu pastekan di bawah kode ]]></b:skin>
<style type='text/css'>
.PopularPosts .item-title{display:none}
.PopularPosts ul li {background: none repeat scroll 0 0 transparent;float: left;list-style: none outside none;margin: 5px !important;padding: 0 !important;}
.PopularPosts ul li img {padding:0;-moz-border-radius: 5px;-webkit-border-radius: 5px;border-radius: 5px;-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;transition: all 0.3s ease;border: 2px solid #CCC;height: 80px;width: 80px;}
.PopularPosts ul li img:hover {border:2px solid #BBB;-moz-transform: scale(1.2) rotate(-1090deg) ;-webkit-transform: scale(1.2) rotate(-1090deg) ;-o-transform: scale(1.2) rotate(-1090deg) ;-ms-transform: scale(1.2) rotate(-1090deg) ;transform: scale(1.2) rotate(-1090deg) ;}
</style>
8. Klik Simpan Template
9. Pilih Tata Letak
entri populer dengan side
 10. Klik Tambah Gadget (pilih yang mana saja)
cara membuat widget entri populer menjadi animasi gambar berputar
 11. Pilih Entri Populer
membuat/memasang widget entri populer yang keren

12. Pilih Judul
13. Pilih Paling Banyak dikunjungi
14. Centang Thumbnail gambar
15. Jangan centang cuplikan
16. Pilih tampilkan hingga
cara membuat entri populer otomatis

  17. Klik Simpan
[source]