Friday, 29 March 2013

Cara Membuat Widget Entri Populer Dengan Gambar Berputar

Cara Membuat Widget Entri Populer Dengan Gambar Berputar adalah cara mengedit blog selanjutnya. Dengan memasang Widget Entri Populer dengan Thumbnail Gambar Berputar, dijamin dapat membuat blog anda lebih hidup bervariasi. Contoh screenshot dari widget ini:

Cara Membuat Widget Entri Populer Dengan Gambar Berputar - Jona Rendra

Telah saya buktikan dan masih di terapkan pada blog ini, widget entri populer dengan gambar bisa berputar jika di sentuh kursor ini membuat blog saya menjadi lebih ringan dibandingkan sebelumnya. Mungkin dikarenakan entri populer yang saya gunakan sebelumnya memuat gambar dan deskripsi. Jika hanya gambar saja, akan lebih ringan. Langsung saja kita ke tutorialnya

Cara Membuat Widget Entri Populer Dengan Gambar Berputar

1. Memasang Widget Entri Populer

Pertama, login ke akun blogger anda
Kedua, pada dashboard blogger, klik menu Tata Letak
Ketiga, klik Tambah Gadget di tempat yang anda inginkan widget ini muncul
Keempat, akan muncul jendela tambah gadget, cari gadget yang bernama Entri Populer
Kelima, atur Judul dan Paling banyak dikunjungi sesuai keinginan anda tetapi untuk Tampilkan, centang thumbnail gambar saja. Untuk Tampilkan hingga, saya buat menjadi 9 karena gambar nanti berderet 3, jadi, agar rapi, buat yang kelipatannya.

Entri Populer - Jona Rendra

Terakhir, klik simpan

2. Memberi Efek Gambar Berputar

Pertama, masuk menu Template
Kedua, klik Edit HTML
Ketiga, cari kode ]]></b:skin>
 menggunakan CTRL + F atau F3
Keempat, copy kode dibawah ini lalu paste di atas 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>
Terakhir, klik Simpan Template

Bagaimana? apakah anda sudah berhasil memasang widget entri populer yang gambarnya bisa berputar? Sekian dulu postingan Jona Rendra yang berjudul Cara Membuat Widget Entri Populer Dengan Gambar Berputar, semoga bermanfaat untuk anda dan jika ada pertanyaan silahkan poskan komentar

KATEGORI:
arrow_back
arrow_forward

13 komentar

ya sama sama
makasih sudah baca artikel saya tang berjudul Cara Membuat Widget Entri Populer Dengan Gambar Berputar

makasih bgt gan skrg blog ku keren bgt,,http://zaidanxzanderz.blogspot.com/

iya, widget ini memang mempunyai tampilan yang unik

sip, kalau berhasih kasi tau ya

owh begitu, saya juga dulu pakai mywapblog, tapi ternyata blogspot lebih ramai, pindah deh

gan kalo komen kayak gitu gimana
ini blog gue baru belaja blog http://hacker5555.blogspot.com/

maksudnya gimana?
mau buat komentar blogger seperti blog ini? atau apa?

apa tu artinya? ^_^
terimakasih aja deh sudah berkomentar

thanks gan,mau ane coba,ditunggu juga kunbalnya :
http://bacainfomu.blogspot.com

Berkomentarlah dengan baik dan benar, dilarang SPAM!
Tata Tertib Berkomentar
EmoticonEmoticon