Contoh : Tampilan Entri Populer |
Selamat malam hadir kembali dengan senyuman yang memberi semangat untuk berbagi tips and trik blog, kali ini saya akan memberikan suatu ilmu atau suatu pembelajaran yang baru mengenai Entri Populer, Apa arti Entri Populer itu sendiri Entri Populer adalah secara bahasa Kata Poko atau Kata Kepala, tapi bukan itu yang dimaksud saya, Entri Populer itu tmapilan artikel yang paling terpopler atau artikel yang paling banyak di baca oleh sahabat blogger atau bisa juga dibaca oleh Mbah Google seperti Contoh : Klik Disini
Setelah anda membaca Entri Populer atau Artikel Yang Paling Banyak Dibaca Google. Sekarang kita masuk ke tahap Tips and Trik Cara Mempercantik Tampilan Entri Populer :
Langkah 1
Terlebih dahulu silahkan anda masuk ke Akun Blog anda
Langkah 2
Masuk ke Menu Rancangan setelah itu Edit HTML
Langkah 3
Jangan lupa untuk mencentang Expand Template Widget, menjaga takut ada kejadian galat didalam kode HTML tersebut.
Langkah 4
Carilah kode ]]></b:skin>
Langkah 5
Masukkan kode dibawah ini tepat dibawah kode ]]></b:skin>
<style type="text/css">
.PopularPosts .item-title{display:none}
.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: italic;
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>
Langkah 6
Setelah anda memasukkan kode tersebut silahkan simpan template anda
Langkah 7
Aktifkan Widget Entri Populer anda dan lihat hasilnya
Catatan Akhir :
Jika anda ingin menampilan Title blog anda harus merubah kode .PopularPosts .item-title{display:none} Menjadi seprti ini .PopularPosts .item-title{display:yes}
Alhamdulillah sudah selesai postingan kali ini semoga bermamfaat buat sahabat blogger semuanya. Thank's you atas kunjungan dan komentarnya.
Posting Komentar
Kebijakan berkomentar akan dihapus, jika tidak sesuai dengan aturan dibawah ini, Demi kenyamanan kita bersama :
» Menggunakan bahasa yang tidak sopan (Sara, Pornografi, Menyinggung)
» Duplikat komentar
» Komentar menautkan link secara langsung
» Komentar tidak berkaitan dengan artikel
» Judul Komentar Berupa Promosi
Terima Kasih .... Lora Malunk Blog