Merubah Label di Blog Menjadi Lebih Menarik

- December 19, 2014

Merubah Label di Blog Menjadi Lebih Menarik

Label / kategori adalah salah satu navigasi untuk mempermudah pengunjung blog untuk mencari tulisan yang diinginkannya, dengan label / kategori default dari blogspot rasanya kurang menarik, terus bagaimana cara merubahnya ? Simak dibawah ini ya...

Setelah mendarat di dashboard klik tata letak kemudian tambahkan label, untuk pengaturannya lihat gambar dibawah ini !

Label


selanjutnya klik save kemudian masuk ke template >> edit HTML lalu temukan kode ]]></b:skin> atau </style> dan pastekan kode dibawah ini diatas kode ]]></b:skin> atau </style>

.Label a {
  border-radius:5px;
  float:left;
  padding:5px 8px;
  margin:3px 3px 0 0;
  background:rgb(0,100,180);
  background:-moz-linear-gradient(top,rgba(0,100,180,1) 0%,rgba(20,60,100,1) 100%);
  background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,rgba(0,100,180,1)),color-stop(100%,rgba(20,60,100,1)));
  background:-webkit-linear-gradient(top,rgba(0,100,180,1) 0%,rgba(20,60,100,1) 100%);
  background:-o-linear-gradient(top,rgba(0,100,180,1) 0%,rgba(20,60,100,1) 100%);
  background:-ms-linear-gradient(top,rgba(0,100,180,1) 0%,rgba(20,60,100,1) 100%);
  background:linear-gradient(top,rgba(0,100,180,1) 0%,rgba(20,60,100,1) 100%);
  filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#0064b4',endColorstr='#123d60',GradientType=0 );
  display:inline-block;
  border:1px solid #005ca6;
  padding:0 8px;
  color:#fff !important;
  height:28px;
  line-height:28px;
  text-transform:capitalize;
  text-decoration:none;
  float:left;
  margin-top:5px;
  font-size:14px;
  -webkit-transition:all .4s ease-in-out;
  -moz-transition:all .4s ease-in-out;
  -o-transition:all .4s ease-in-out;
  -ms-transition:all .4s ease-in-out;
  transition:all .4s ease-in-out;
  text-shadow:0 -1px -1px rgba(0,0,0,0.2);
}

.Label a:hover {
  color:#0afafa !important;
  background:#123d60;
}


Simpan template jika selesai



Untuk warna silahkan berkreasi sendiri

Share this with short URL:
Blogger
Disqus
Tinggalkan Komentar

No comments

[+] Silahkan tinggalkan komentar
[+] Berkomertarlah dengan santun
[+] Mohon tidak meninggalkan live link
[+] Terima kasih untuk komentar anda

 

ketik dan enter untuk mencari