Saturday, February 1, 2014

Membuat Popular Post Dengan Bentuk Bulat di blog



Nah ini cara baru membuat pos yang popular dalam artikata yang paling banyak dilihat atau diklik pengunjung dengan gaya yang bahasa PLANETnya = Popular Posts by Circle Image Style= yang bahasa indonesianya Popular Posts Dengan Gambar Image Bulat + berputar ketika tersentuk Icon mouse.

Membuat Popular Posts Dengan Gambar Image Bulat Berputar
1. Login blog Kamu
2. Klik Design > Edit HTML > centang pada Expand widget template
3. Cari kode  ]]></b:skin>
   Gunakan CTRL+F agar lebih mudah dalam mencari kodenya
4. Copy kode dibawah ini dan letakan diatas kode  ]]></b:skin>
.popular-posts ul{padding-left:0px;font:14px PT Sans Narrow;text-align:justify;color:#555;line-height:14px;margin:5px 0} .popular-posts ul li {background: url(#) no-repeat scroll 5px 5px; list-style-type: none; margin:0 0 5px 0px; padding:5px 5px 5px 5px !important;font-size:12px!important;font-weight:550; border: 1px solid #58ACFA; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; } .popular-posts ul li:hover { background: #CCE9FD;border:1px solid #58ACFA; } .popular-posts ul li a:hover { text-decoration:none; } .popular-posts .item-thumbnail img { -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px; -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .4); -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, .4); box-shadow: 0 1px 3px rgba(0, 0, 0, .4);height:70px;width:70px;}.popular-posts .item-thumbnail img:hover { -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px; -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .4); -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, .4); box-shadow: 0 1px 3px rgba(0, 0, 0, .4);-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
-webkit-transform:rotate(360deg);
-moz-transform:rotate(360deg);
-ms-transform:rotate(360deg);
-o-transform:rotate(360deg);
transform:rotate(360deg);}
5. Save dan lihat hasilnya.
Catatan : Ayo coba dan  coba moga2 sukses.


Bagikan ke :

Facebook Google+ Twitter Digg Technorati Reddit
0 Comments
Tweets
Komentar

0 comments:

Post a Comment