Minggu, 03 Mei 2015

Cara Membuat Widget Recent Posts Bergerak di Blog

Pasti agan sudah pernah liat Gambar pada Widget Popular Posts mempunyai efek berputar, akan mempercantik tampilan Blog. Ketika cursor disentuhkan pada gambar di widget popular posts, gambar tersebut akan berputar.

Cara membuatnya ga ribet ko gan.. asal agan ada kemauan pasti agan bisa..


 Silahkan disimak langkah-langkahnya gan.. 

1. Login ke akun Blogger.

2. Pastikan widget popular posts telah terpasang di Blog sobat. Jika belum pasanglah terlebih dahulu. Saya yakin hal tersebut gampang dan tidak perlu panduan khusus.

3. Jika telah terpasang, sobat masuk pada bagian template.

4. Klik Edit Template.

5. Cari kode ]]></b:skin> , agar lebih mudah gunakan tombol ctrl+F.

6. Masukan kode berikut diatas 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>

7. Klik Simpan.


Read more: http://dvayshare.blogspot.com/2014/01/cara-membuat-widget-recent-posts.html#ixzz3YDkStlJ0

Tidak ada komentar:

Posting Komentar