Cara Modifikasi Widget Label Pada Blogger Bagian 2

Postingan kali ini merupakan kelanjutan dari postingan sebelumnya yakni versi lain dari tampilan widget label pada blog.

Bagaimanakah tampilan widget label versi ke 2 ini? Kasih tau gak ya…?? Kurang lebih tampilannya seperti gambar di bawah ini.

Gimana apakah sobat tertarik untuk memodifikasi tampilan widget label di blog sobat. Jika sobat berminat ikuti langkah-langkah di bawah ini.

1. Login ke blogger atau klik disini

2. Pilih Template » Edit Html » Lanjutkan.

3. Jangan lupa centang Expand Template Widget.

4. Cari code ]]></b:skin> Tekan Ctrl+F atau F3 untuk mempermudah pencarian. 

5.Setelah code di atas ketemu copy paste code di bawah ini dan letakkan sebelum code  ]]></b:skin>

.label-size{margin:0 2px 6px 0;padding: 3px;text-transform: uppercase;border:
  solid 1px #4F4F4F;border-radius:
  3px;float:left;text-decoration:none;font-size:10px;color:#FF4F4F}
.label-size:hover
  {border:1px solid #6BB5FF;text-decoration: none;-moz-transition: all 0.5s
  ease-out;-o-transition: all 0.5s ease-out;-webkit-transition: all 0.5s
  ease-out;-ms-transition: all 0.5s ease-out;transition: all 0.5s
  ease-out;-moz-transform: rotate(7deg);-o-transform:
  rotate(7deg);-webkit-transform: rotate(7deg);-ms-transform:
  rotate(7deg);transform: rotate(7deg);filter:
  progid:DXImageTransform.Microsoft.Matrix(M11=0.9961946980917455,
  M12=-0.08715574274765817, M21=0.08715574274765817, M22=0.9961946980917455,
  sizingMethod='auto expand');zoom: 1}
.label-size a {text-transform:
  uppercase;float:left;text-decoration: none}
.label-size a:hover
  {text-decoration: none;text-shadow:0 0 8px red;color:#A91B33;}

6. Simpan/save template

Semoga tutorial kali ini bermanfaat, Happy Blogging