Mempercantik Widget Entri

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}