Popular Post Efek Snippet Sliding - Seperti halnya widget metro drop down sliding untuk blog gaya metro style kali ini saya akan memberikan sedikit tips sederhana memodifikasi widget popular post. Mungkin bagi kalian semua sudah tidak asing lagi dengan widget yang satu ini, setiap blog pasti mempunyai widget popular post. Widget unik ini berfungsi untuk menampilkan artikel yang sering di buka atau dibaca oleh pengunjung blog, lebih tepatnya adalah artikel populer blog. Blogger menyediakan widget ini secara default, namun untuk tampilan disetiap blog bisa saja berbeda - beda. Sebenarnya untuk costumisasi widget ini kita hanya memerlukan kode CSS untuk merubah bentuk, warna dan efeknya. Dibawah ini adalah contoh sederhana untuk kode CSSnya : .popularposts .widget-content ul li{padding:0;position:relative} .item-snippet { font-size: 90%; line-height: 1.2em; position: absolute; width: 200px; background-color: #27ae60;color:#fff; padding: 7px; border: 1px solid #27ae60; z-index: 2; left: 300px; top: 50%; height: auto!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%} Kita hanya perlu menambahkan kode CSS ini sebelum kode ]]> Untuk demonya bisa anda lihat pada Responsive Simple Metro Mini template. Widget unik ini akan lebih pas dan cocok dengan template blog metro style. Demikian sedikit tips blog yang saya berikan semoga bermanfaat. Salam Blogger Virlyz82, Feb 9, 2014 #1 pram Well-Known Member Joined: Sep 23, 2013 Messages: 3,099 Likes Received: 161 Trophy Points: 63 Google+: Author cocok banget nih mas, untuk cocok banget nih mas, untuk flat template pram, Feb 9, 2014 #2 Virlyz82 Member Joined: Jan 23, 2014 Messages: 67 Likes Received: 2 Trophy Points: 8 Google+: Author Siip sesuai konsep flat metro ui mas Virlyz82, Feb 11, 2014 #3 egelz Member Joined: Jan 5, 2014 Messages: 44 Likes Received: 1 Trophy Points: 8 bagus tuh wah bagus tuh gan. Jadi lebih menarik blog kita egelz, Feb 20, 2014 #4 (You must log in or sign up to reply here.) Show Ignored Content Loading... Similar Threads - Membuat Widget Popular Cara Membuat Sticky Widget di Blog Kanggarda, Sep 5, 2013, in forum: Blogger Replies: 1 Views: 993 ncang Sep 5, 2013 [ASK] Cara membuat Shortener Generate Link Domain Sendiri Pasha Lovarian, Mar 15, 2017, in forum: Blogger Replies: 5 Views: 3,713 compzone08 Oct 3, 2017 [Ask] Bagaimana cara membuat gambar artikel vertikal jadi horizontal? BangNasti, Mar 5, 2017, in forum: Blogger Replies: 10 Views: 2,986 #BOOM Mar 5, 2017 [HELP] Cara membuat subdomain di cloudflare? Musthafa Kamal, Apr 2, 2016, in forum: Blogger Replies: 21 Views: 4,920 Musthafa Kamal Jul 14, 2016 [ ASK ] Cara Membuat Kotak KomenSeperti Forum Leon Sion Turnip, Jan 8, 2016, in forum: Blogger Replies: 6 Views: 1,260 zaarsaja Feb 4, 2016 Share This Page Tweet Log in with Facebook Log in with Twitter Your name or email address: Do you already have an account? No, create an account now. Yes, my password is: Forgot your password? Stay logged in