Cara Menghias Label Blog

Nah kali ini saya akan share tentang bagaimana menghias atau custom label bawaan blogger agar menjadi lebih menarik dan tentunya bisa anda rubah seperti yang anda inginkan. Tutorial ini menghias label seperti yang di blog ini namun anda bisa merubah kode CSS seperti yang anda inginkan.

1. Log in Blogger klik tata letak dan tambahkan widget.
2. Tambahkan popular post (Ingat untuk membuat pengaturan cloud di popular post bukan baris).
3. Setelah semua beres masuk ke pengaturan template dan edit HTML.
4. Cari kode berikut ]]></b:skin> dan letakan kode CSS berikut ini diatas kode tersebut:

.Label a {
    padding: 5px;
    background: #359bed;
    color: #fff!important;
    text-decoration: none;
    border: none !important;
    float: left;
    margin-left: 5px;
    margin-top: 5px;
    font-size: 14px;
}

.Label a:hover {
    color: #fff !important;
    background: #000000;

5. Klik pratinjau jika tidak terjadi eror klik simpan maka hasilnya akan seperti dibawah ini:
Cara Menghias Label Blog
Atau anda bisa mengganti kode CSS dia atas dengan kode seperti dibawah ini:
.Label a {
    padding-left: 20px;
    background: #000;
    padding: 0 20px;
    color: #fff!important;
    border-radius: 100px;
    -moz-border-radius: 100px;
    height: 32px;
    line-height: 32px;
    text-transform: uppercase;
    text-decoration: none;
    border: none !important;
    -webkit-transition: all .3s ease-in-out !important;
    t: 30pxt: 30px;
    float: left;
    margin-left: 5px;
    margin-top: 5px;
    font-size: 14px;
}

.Label a:hover {
    color: #000 !important;
    background: #ff0;
}

Maka hasilnya akan seperti dibawah ini:
Cara Menghias Label Blog

Unknown

Phasellus facilisis convallis metus, ut imperdiet augue auctor nec. Duis at velit id augue lobortis porta. Sed varius, enim accumsan aliquam tincidunt, tortor urna vulputate quam, eget finibus urna est in augue.

Tidak ada komentar:

Posting Komentar