Membuat Popular Posts Dengan Efek Geser di Blog

Membuat Popular Posts Dengan Efek Geser di Blog | Widget Popular Posts bisa membantu para pengunjung untuk mengetahui artikel artikel apa yang banyak di kunjungin blog kita, Banyak sekali Popular Posts dengan aneka bentuk yang berbeda beda. 

Tapi, Popular posts yang akan saya bagikan ini, Memiliki keunikan, Widget  di sertakan gambar artikel dan memiliki efek geser, kalau kursor mengarah ke dalam widget ini, dan ke judul artikel popular posts, secara otomatis akan ada penjelasan singkat tentang artikel tersebut.

Artikel dan tutorial nya cara membuatnya seperti di bawah ini :

• Login ke Blogger.com
• Setekah itu, klik Menu ''Template''
• Klik ''Edit HTML''
• Cari kode ]]></b:skin Kalau sudah ketemu masukan kode dibawah ini, Sebelum kode ]]></b:skin

/* Popular Post  */

.PopularPosts .widget-content ul li{padding:0;position:relative}

.item-snippet {font-size: 90%;line-height: 1.2em;position: absolute;width: 230px;background-color: whiteSmoke;padding: 7px;border-top: 2px solid #FF0202;z-index: 2;left: 300px;top: 60%;height: 4.5em!important;visibility: hidden;opacity: 0;transition: all 0.6s cubic-bezier(1,2,0,0) 0s;-moz-transition: all 0.6s cubic-bezier(1,2,0,0) 0s;-webkit-transition: all 0.6s cubic-bezier(1,2,0,0) 0s;-o-transition: all 0.6s cubic-bezier(1,2,0,0) 0s;}

.PopularPosts .widget-content ul li:hover .item-snippet{left:60px;opacity:1;visibility:visible}

.PopularPosts img{width:50px;height:50px}

.PopularPosts .item-title{font-family:'Open Sans Condensed',"Arial Narrow",Arial,sans-serif;font-size:125%}

/* Popular Post */

• Setelah itu, klik SIMPAN

Demikianlah artikel ini, Semoga artikel yang saya bagikan bermanfaat dan mudah di pratekkan