Sabtu, 07 Mei 2011

Cara Membuat Popular Posts Dengan Gambar with Css Di Blogger

Cara Membuat Popular Posts Dengan Gambar with Css Di Blogger - Hujangede Online memberikan trik blog lagii ni, yang sebelumnya telah posting juga artikel tentang trik blog (Artikel : Cara Membuat Menu Navigasi Inverted Down Di blogspot ) yang berhubungan dengan navigasi Blogspot/blogger, dan saya juga telah posting juga (baru kemaren) artikel tentang widget blog (Artikel : Kumpulan Widget Blogger Indonesia ) dan ini adalah widget - widget blogger indonesia , apakah kamu blogger indonesia pakailah widget Kumpulan Widget Blogger Indonesia ini supaya pengunjung dari luar indonesia bisa mengetahui blog anda berasal dari indonesia, pasang ya. oke lanjutkan lagii ke artikel Cara Membuat Popular Posts Dengan Gambar with Css Di Blogger , Popular Posts Dengan Gambar ini bukan gambar tampilan seperti biasa , tapi ini dengan tambahan Script yang di simpan sebelum kode ]]></b:skin> . penasaran??. bila penasaran liat lah demo gambar dan demo web dibawah ini .
Cara Membuat Popular Posts Dengan Gambar with Css Di Blogger

Bila kurang jelas ada demonya , tapi tidak saya pasang di blog ni , clik link dibawah ini:
(Silahkan Clik Iklan yang lewat)

Ingin juga membuat nya silahkan ikuti cara - caranya di bawah ini :
Cara pembuatan : Cara Membuat Popular Posts Dengan Gambar with Css Di Blogger
Step - Step :
 1. Log In ke Blogger
 2. Silahkan Menuju Layout ( Rancangan )> Edit HTML dan check Expand Widget Templates

 3. Cari Kode ]]></b:skin> Dan simpan kode CSS dibawah ini tepat diatas Kode tadi .

/*-----------------------------------------
  {Hujangede}  Popular Post  {Online}
-------------------------------------------*/
.item-thumbnail img {
margin: 2px 20px 0 0;
padding: 4px;
float: left;
       -moz-border-radius: 4px;
       -webkit-border-radius: 4px;
background-color: #24282a;
border: 1px solid #383c3e;
text-align: left;
        width:105px;
        height:105px;
        opacity:0.6;filter:alpha(opacity=40)
}
.item-thumbnail img:hover{-moz-opacity:100; filter:alpha(opacity=100); opacity:100;}
.item-snippet {
        display:none;
}
.item-title{display:none;}
.popular-posts {
width: 290px;
float: left;
margin:0 0 10px 0;
}
.popular-posts ul {
width: 290px;
margin: 0px 0 0 0;
padding: 0;
float: left;
list-style: none;
}
.popular-posts ul li {
width: 105px;
height: auto;
margin:0 10px;
float: left;
display: block;
font: normal 13px Arial, Helvetica, sans-serif;
color: #000;
line-height: 22px;
background: none;
}
 4.  dan clik simpan template
 5.  silahkan menuju Layout ( Rancangan ) dan tambah Gadget Populer Posts
 6. Dan simpan, liat hasilnya .

!Hore Postingan Cara Membuat Popular Posts Dengan Gambar with Css Di Blogger beres juga , semoga bermanfaat.