Cara Membuat Popular Post dengan Thumbnail Horizontal

Ikuti langkah-langkahnya berikut ini:
  • Login ke Dashboard blogger >> Design >> Edit Html. Atau Jika menggunakan fitur yang bahasa indonesia Beranda >> Rancangan >> Edit Html.
  • Cari kode ]]</b:skin>
  • Kemudian letakkan kode CSS berikut ini di atasnya.
#content-footer{
width:100%;
clear:both
}
#content-footer h2{
color: #333;
text-transform: none;
font-family:  Georgia;
font-size: 16px;
font-weight: 700;
margin-bottom: 0px;
padding: 5px 15px;
}

.bottom-content .PopularPosts ul {
padding: 0;
margin: 0px;
background: #FFF;
overflow:hidden;
}
.bottom-content .PopularPosts ul li {
width: 82px;
padding: 0; margin:0 7px 0;
border: none;
float: left;
list-style: none;
line-height: 1em;
}
.bottom-content .PopularPosts {
background: none!important;
}
.bottom-content .PopularPosts .item-thumbnail img {
width:82px;
height:105px;
padding:0;
}
.bottom-content .PopularPosts .item-title {
padding: 5px 0;
margin:0px 0 10px;
font:bold 11px Georgia;
border-bottom: 1px solid #861519;
clear:both; height: 37px;
overflow: hidden; text-align: center;
}
.bottom-content .PopularPosts .item-title a {
color:#25c;
}
.bottom-content .PopularPosts .item-snippet {
margin:10px 0;
color:#4f4f4f;
}
.bottom-content .section{
margin: 0 5px;
}
  • Berhubung pada template ini widget popular post saya pasang di atas footer maka yang selanjutnya adalah cari kode: <div id='footer-wrapper'> atau sejenisnya, kemudian letakkan kode dibawah ini diatasnya
<div id='content-footer'>
<b:section class='bottom-content' id='widget-footer'>
<b:widget id='PopularPosts1' locked='false' title='Entri Populer' type='PopularPosts'/>
</b:section>
</div>
  • Save Template.

Klik tautan ini untuk demo

Sumber: http://lagudoang.blogspot.com/

Kalau manfaat, jangan lupa dishare...
Artikel Cara Membuat Popular Post dengan Thumbnail Horizontal ini Anda baca di webeson.blogspot.com Jika Anda merasa artikel ini bermanfaat, jangan lupa kasih komentar.

Terimakasih atas kunjungan Anda. Kritik dan saran dapat anda sampaikan melalui kotak komentar. Silahkan baca Posting Meranik Lainnya di bawah ini dan jangan lupa berkunjung kembali
Flag Counter

  ©webeson - All Rights Reserved.

Template by Dicas Blogger | Top