Percantik tampilan Label/Category pada blogger

Pada posting kali ini saya akan berbagi sedikit tentang bagaimana cara membuat tampilan Label pada blogger sobat menjadi lebih menarik.
Berikut ini caranya

1. Pastikan anda sudah memasang widget label pada blog anda. Jika belum anda perlu menambahkannya terlebih dahulu dengan cara Tata letak > Tambah Gadget > Label 
2. Tambahkan Widget html Tata letak > Tambah Gadget > HTML/Java Script

Pastekan Code Dibawah ini

<style type="text/css">
/*<![CDATA[*/
.label-size {
    float:left;
    margin:0 0 7px 20px;
    position:relative;
    line-height:1;
    font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-size:0.75em;
    font-weight:bold;
    text-decoration:none;

    color:#996633;
    text-shadow:0px 1px 0px rgba(255,255,255,.4);

    padding:0.417em 0.417em 0.417em 0.917em;

    border-top:1px solid #d99d38;
    border-right:1px solid #d99d38;
    border-bottom:1px solid #d99d38;

    -webkit-border-radius:0 0.25em 0.25em 0;
    -moz-border-radius:0 0.25em 0.25em 0;
    border-radius:0 0.25em 0.25em 0;

    background-image: -webkit-linear-gradient(top, rgb(254, 218, 113), rgb(254, 186, 71));
    background-image: -moz-linear-gradient(top, rgb(254, 218, 113), rgb(254, 186, 71));
    background-image: -o-linear-gradient(top, rgb(254, 218, 113), rgb(254, 186, 71));
    background-image: -ms-linear-gradient(top, rgb(254, 218, 113), rgb(254, 186, 71));
    background-image: linear-gradient(top, rgb(254, 218, 113), rgb(254, 186, 71));
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#feda71', EndColorStr='#feba47');

    -webkit-box-shadow:
        inset 0 1px 0 #faeaba,
        0 1px 1px rgba(0,0,0,.1);
    -moz-box-shadow:
        inset 0 1px 0 #faeaba,
        0 1px 1px rgba(0,0,0,.1);
    box-shadow:
        inset 0 1px 0 #faeaba,
        0 1px 1px rgba(0,0,0,.1);

    z-index:100;
}

.label-size:before {
    content:'';

    width:1.30em;
    height:1.39em;

    background-image: -webkit-linear-gradient(left top, rgb(254, 218, 113), rgb(254, 186, 71));
    background-image: -moz-linear-gradient(left top, rgb(254, 218, 113), rgb(254, 186, 71));
    background-image: -o-linear-gradient(left top, rgb(254, 218, 113), rgb(254, 186, 71));
    background-image: -ms-linear-gradient(left top, rgb(254, 218, 113), rgb(254, 186, 71));
    background-image: linear-gradient(left top, rgb(254, 218, 113), rgb(254, 186, 71));
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,StartColorStr='#feda71', EndColorStr='#feba47');

    position:absolute;
    left:-0.69em;
    top:.2em;

    -webkit-transform:rotate(45deg);
    -moz-transform:rotate(45deg);
    -o-transform:rotate(45deg);
    transform:rotate(45deg);

    border-left:1px solid #d99d38;
    border-bottom:1px solid #d99d38;

    -webkit-border-radius:0 0 0 0.25em;
    -moz-border-radius:0 0 0 0.25em;
    border-radius:0 0 0 0.25em;

    z-index:1;
}

.label-size:after {
    content:'';

    width:0.5em;
    height:0.5em;

    background:#fff;

    -webkit-border-radius:4.167em;
    -moz-border-radius:4.167em;
    border-radius:4.167em;

    border:1px solid #d99d38;

    -webkit-box-shadow:0 1px 0 #faeaba;
    -moz-box-shadow:0 1px 0 #faeaba;
    box-shadow:0 1px 0 #faeaba;

    position:absolute;
    top:0.667em;
    left:-0.083em;
    z-index:9999;
}
#Label1 {height:210px;}
.label-size:hover {
    background-image: -webkit-linear-gradient(top, rgb(254, 225, 141), rgb(254, 200, 108));
    background-image: -moz-linear-gradient(top, rgb(254, 225, 141), rgb(254, 200, 108));
    background-image: -o-linear-gradient(top, rgb(254, 225, 141), rgb(254, 200, 108));
    background-image: -ms-linear-gradient(top, rgb(254, 225, 141), rgb(254, 200, 108));
    background-image: linear-gradient(top, rgb(254, 225, 141), rgb(254, 200, 108));
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#fee18d', EndColorStr='#fec86c');

    border-color:#e1b160;
}

.label-size:hover:before {
    background-image: -webkit-linear-gradient(left top, rgb(254, 225, 141), rgb(254, 200, 108));
    background-image: -moz-linear-gradient(left top, rgb(254, 225, 141), rgb(254, 200, 108));
    background-image: -o-linear-gradient(left top, rgb(254, 225, 141), rgb(254, 200, 108));
    background-image: -ms-linear-gradient(left top, rgb(254, 225, 141), rgb(254, 200, 108));
    background-image: linear-gradient(left top, rgb(254, 225, 141), rgb(254, 200, 108));
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,StartColorStr='#fee18d', EndColorStr='#fec86c');

    border-color:#e1b160;
}
/*]]>*/
</style> 
<p style="display:none;">Label Widget by <a href="http://goresan-sebuahpena.blogspot.com/2013/02/percantik-tampilan-labercategory-pada.html">Goresan Sebuah Pena</a></p>

lalu SAVE,, selesai

smoga artikel ini bermanfaat bagi kita semua amiin,,