Post Anyar

6/recent/ticker-posts

Modifikasi Tampilan Widget Label Blogger

Modifikasi Tampilan Widget Label Blogger - Label adalah sebuah kategori yang menggabungkan beberapa macam isi kategori dari sebuah postingan. Widget label default blogger memang memiliki beberapa modifikasi tapi tidak banyak memberikan pengaruh pada segi desain. Modifikasi Tampilan Widget Label Blogger yang ini juga tidak mengurangi kecepatan loading dari blog sobat.


Berikut Ini Cara Modifikasi Tampilan Widget Label Blogger :

1. Login ke Blogger.
2. Kemudian Pilih Tata LetakTambah GadgetLabel.
3. Kemudian Coba Sobat Configurasikan seperti pada gambar dibawah ini.


4. Selanjutnya simpan.
5. Dan langkah berikutnya pilih TemplateEdit HTML.
6. Cari kode ]]></b:skin> dan letakkan kode berikut diatas kode ]]></b:skin>
/* Code By http://kompormeledak.blogspot.com */
.list-label-widget-content ul
{
list-style-type:none;
padding-left:0px !important;
display:inline-block !important;
}
.list-label-widget-content li {
display:inline-block;
}
.list-label-widget-content li a {
color: #777;
font: 9px verdana;
text-transform: uppercase;
transition: border-color .218s;
background:
#f4f4f4;
background: -webkit-gradient(linear, 0% 40%, 0% 70%, from(
#F5F5F5), to(
#F1F1F1));
display: inline-block;
text-shadow: 0 1px 0
#fff;
-webkit-transition: border-color .218s;
-moz-transition: border .218s;
-o-transition: border-color .218s;
transition: border-color .218s;
background:
#f3f3f3;
background: -webkit-gradient(linear, 0% 40%, 0% 70%, from(
#F5F5F5), to(
#F1F1F1));
background: -moz-linear-gradient(linear, 0% 40%, 0% 70%, from(
#F5F5F5), to(
#F1F1F1));
border: solid 1px
#ccc;
border-radius: 2px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
margin: 0 4px 4px 0;
padding: 3px 5px;
text-decoration: none;
}
.list-label-widget-content li a:hover {
color: #333;
border-color: #999;
-moz-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.2) -webkit-box-shadow:0 2px 5px rgba(0, 0, 0, 0.2);
box-shadow: 0 1px 2px
rgba(0,0,0,0.15);
}
7. Simpan Template, dan lihat hasilnya. Selamat mencoba dan semoga bermanfaat.

Post a Comment

0 Comments