Popular Post Multi Template
Edit The Code:
See Result »
Try it Yourself - ©
v5blogger
648px x 516px
<!------------------ Copy Code Start Here --------------------> <style> .PopularPosts .item-thumbnail {float: left; padding-right: 10px;} .PopularPosts h2{background:#2a3542 !important} .PopularPosts h2:before{content:" \f087" ; font-family:FontAwesome; font-size:22px; background:rgba(0,0,0,0.2); padding:10px 12px; margin:0 10px 0 0; border-radius:4px 0 0} .PopularPosts ul{list-style-type:none; padding:5px} .PopularPosts{color:#fff; line-height:1.6; font-size:100%; border-radius:5px 5px 0 0;} .PopularPosts{line-height:1.6; font-size:100%; border-radius:0; color:#fff} .PopularPosts a{color:#fff} .PopularPosts a:hover{color:#fff} .PopularPosts ul{list-style:none; margin:0; margin-left:-18px; padding:0; counter-reset:popcount} .PopularPosts ul li:before{list-style-type:none; margin-right:15px; margin-left:5px; padding:0.3em 0.6em; counter-increment:popcount; content:counter(popcount); font-size:16px; color:#fff; position:relative; float:left; border:1px solid #fff; border-radius:100%} .PopularPosts li{text-transform:uppercase; background:none; margin:0; padding:10px 18px; display:block; clear:both; overflow:hidden; list-style:none; font:13.5px/140%; border-bottom:none} .PopularPosts .item-snippet {display: none;} .PopularPosts li:hover{background:#0FB9BB} .PopularPosts li a{text-decoration:none} .PopularPosts ul li{padding:3px 20px; border:none} .PopularPosts ul li:nth-child(1){background-color:#F48067; margin-right:0} .PopularPosts ul li:nth-child(2){background-color:#2ba6e1; margin-right:0} .PopularPosts ul li:nth-child(3){background-color:#718397; margin-right:0} .PopularPosts ul li:nth-child(4){background-color:#11b7b5; margin-right:0} .PopularPosts ul li:nth-child(5){background-color:#d9ba71; margin-right:0} .PopularPosts ul li:nth-child(6){background-color:#F48067; margin-right:0} .PopularPosts ul li:nth-child(7){background-color:#2ba6e1; margin-right:0} .PopularPosts ul li:nth-child(8){background-color:#718397; margin-right:0} .PopularPosts ul li:nth-child(9){background-color:#11b7b5; margin-right:0} .PopularPosts ul li:nth-child(10){background-color:#d9ba71; margin-right:0} .PopularPosts .item-thumbnail {display: none;} </style> <!------------------ Copy Code End Here --------------------> <div class='widget PopularPosts' data-version='1' id='PopularPosts1'> <h2> Popular Posts</h2> <div class='widget-content popular-posts'> <ul> <li><div class='item-content'> <div class='item-thumbnail'> <a href='/' target='_blank'><img alt='' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCxz8OvzH2BCIS9F2PIyfF91zQAIj4e0nascSdSmPFx34-0hxVRYxIOJPOPl3Kk0A6ifD1xqIIXSg3clJnvuA2bHUjYlsYGFlKT5ni3rzmnHP7WuHASprIELJuOGx7p4X69ypoir-Rmvg/s1600/1.jpg'/></a></div> <div class='item-title'> <a href='/'>How not knowing weight loss supplements makes you a rookie</a></div> <div class='item-snippet'> Expose: you're losing money by not using preventative medicines. 6 ways fitness programs can find you the love of your life. Why cholest...</div> </div> <div style='clear: both;'> </div> </li> <li><div class='item-content'> <div class='item-thumbnail'> <a href='/' target='_blank'><img alt='' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh7zVpURaByEkgmB1GU6lk2HZ82cmOXQ19gM1VQd10WHboulHDGWa7PUCcJtg8oB_O8YkqSGUIXzWrf65lPNBKwhDfaBSRJvn5o7qgzP7lCQWDIAJUcBmGCgrL4SjA6d-EMXD0tHWZLBQk/s1600/2.jpg'/></a></div> <div class='item-title'> <a href='/'>Will makeup brushes ever rule the world?</a></div> <div class='item-snippet'> The oddest place you will find celebrity houses. The 15 best lifestyle blog youtube videos. Why you'll never succeed at celebrity gossip...</div> </div> <div style='clear: both;'> </div> </li> <li><div class='item-content'> <div class='item-thumbnail'> <a href='' target='_blank'><img alt='' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggaygZwwoMmK041gMY3Hjq5juF5IHMyVQKAA5yD4qHnOZqg5b6ksRC7bxifXTr4Cwf9zs7W3IFtlxS-ySR14q0jt2OqKHT2XiIu8Zd-ri_PfbUlYCzzZLpGzXJLaxJCdLy8C3k1hCt7ws/s1600/3.jpg'/></a></div> <div class='item-title'> <a href=''>Why unique dresses are on crack about unique dresses</a></div> <div class='item-snippet'> Why do people think trendy cloths are a good idea? If you read one article about women cloths read this one. The 8 biggest fashion magazine ...</div> </div> <div style='clear: both;'> </div> </li> </ul> </div> </div>
Newer Post
Older Post
Home