Cara Membuat Widget Pupoler Post Dengan Hover Efek
Di postingan saya kali ini akan memberikan tutorial Cara Membuat Pupoler Post Dengan Hover Efek.Populer post adalah artikel/postingan yang sering di lihat/dibaca oleh pengunjung.tutorial yang saya berikan ini,populer postnya mempunyai tumbnail yang sangat bagus,jadi dapat memperindah tampilan blog anda.Dengan memasang widget populer post,pengunjung akan mengetahui artikel-artikel di blog anda yang sering dibaca oleh pengunjung blog.Populer post ini sangat keren karena mempunyai hover efek,jika anda belum tahu apa itu hover efek anda dapat browsing di google atau anda bisa memasangnya langsung di blog anda tanpa harus browsing lewat google.widget populer post yang saya berikan ini pemasanganya mudah.Sebelum anda membuat populer post di blog anda,pastikan terlebih dahulu bahwa anda telah memunculkan populer post di blog anda,Namun jika anda belum memunculkan di blog anda anda dapat memunculkan dengan cara Layout → Add a Gadget → Popular Posts.jika populer post pada blog anda telah muncul sekarang copy kode di bawah ini dan paste di atas kode ]]></b:skin> dan save template.
/* Popular Post Customization by AllBloggerTricks */
.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 Customization by AllBloggerTricks */
.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 Customization by AllBloggerTricks */
Tidak ada komentar:
Posting Komentar
SILAHKAN BER KOMENTAR DENGAN PINTAR DAN BIJAK
Di larang meninggalkan link aktif
Di larang berkomentar yang berbau sara,,penghinaan dan penipuan
Semua komentar tidak langsung muncul,Komentar yang anda buat akan di baca oleh admin terlebih dahulu.