Stay Connected

Read latest headlines in your favorite news reader
Fellow Readers
Sign up for our email news letter

PILIH WARNA YANG ANDA SUKA

Rabu, 22 Agustus 2012

1 Membuat Widget Entri Populer Tampil Lebih Keren dan Oke

بِسْــــــــــــــــمِ اﷲِالرَّحْمَنِ اارَّحِيم


Jangan Lupa Tinggalkan Komentar Kalian Ya...!!!

Entri Populer Cantik
Tampilan Widget Entri Populer
Pada kesempatan kali ini saya mau berbagi tentang cara membuat widget entri populer yang seperti terpasang di sidebar blog saat ini. Sebenarnya widget ini merupakan widget kepunyaan Blogger sendiri yang ditambahkan kode css tertentu agar tampak lebih menarik dan lain dari pada yang lain.


Bagaimana cara membuatnya? Silakan disimak langkah-langkahnya di bawah ini. Semoga berhasil.

1. Masuk ke akun Blogger Anda.

2. Klik Rancangan > Edit HTML.

3. Klik Download Template Lengkap untuk berjaga-jaga kalau-kalau nanti terjadi kesalahan dalam pengeditan.

4. Silakan cari kode ]]></b:skin>.

5. Letakkan kode berikut di bawah kode ]]></b:skin>.


<style type='text/css'>
.PopularPosts .item-title{display:yes}
.PopularPosts ul li {
border-radius:50px 0px 0px 50px;
float: left;list-style: none outside none;margin: 1px !important;padding: 1px !important;
border: 1px solid #444;
overflow: hidden;
box-shadow: 0px 0px 1px #333;
font-style: normal;
font-weight:bold;
width: 100%;
height:60px;
border-radius:35px 5px 5px 35px;
}
.PopularPosts ul li:hover{
background: -moz-linear-gradient(top, #FFFFFF 1%, #5c5c5c 50%);
overflow: hidden;
color: #414141;
width: 100%;
height:60px;
border: 1px solid #ffffff;
box-shadow: 0px 0px 2px #ffffff;
}
.PopularPosts ul li img {
padding:1px ;
margin:1px;
margin-top:3px;
border-radius:35px 35px 35px 35px;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
transition: all 0.3s ease;
border: 1px solid #333;
height: 50px;width:50px;
overflow: hidden;
}
.PopularPosts ul li img:hover {
border:1px solid #ffffff;
border-radius:25px 25px 25px 25px;
background: -moz-linear-gradient(top, #FFFFFF 1%, #5c5c5c 50%);
box-shadow: 0px 0px 10px #ffffff;
}
</style>
 
6. Klik tombol Pratinjau ,jika berhasil kemudian SIMPAN TEMPLATE
 Selamat mencoba & Semoga bermanfaat :D

Ditulis Oleh : rian hidayat ~ Anda berada di Blorinet education

Artikel Membuat Widget Entri Populer Tampil Lebih Keren dan Oke ini diposting oleh rian hidayat pada hari Rabu, 22 Agustus 2012. Terimakasih atas kunjungan Anda serta kesediaan Anda membaca artikel ini. Kritik dan saran dapat anda sampaikan melalui kotak komentar.

:: Get this widget ! ::

1 komentar:

Unknown mengatakan...

thanks gan infonya tp msih blum pngi coba.. hehehe...
kunjungi balik http://yusuefarshablog.blogspot.com

Posting Komentar

Related Posts Plugin for WordPress, Blogger...

close
cbox
Blorinet education on
Add Me
Follow Me
Add and Follo Me
Add Me
Add Me
Langganan Gratis
KontesSEO