Blogger Etiketlerinizi Renklendirin

Merhaba;

Bu Yazımda Blogger Sitenizdeki Etiketleri Nasıl Renklendiririz Onu Göstereceğim. Hemen Eklentinin Adımlarına Geçiyorum.

Adım 1: Blogger Panelinden Etiket Gadgetini Ekliyoruz. Resimdeki Gibi Kutucukları İşaretliyoruz. Bilmeyenler İçin Blogger Paneli>Yerleşim>Gadget Ekle>Etiket Yolunu İzleyin.

Adım 2: Şimdi Etiketlerimizi Renklendiriceğiz. Şu Yolu İzleyin Blogger Paneli>Şablon>Özelleştir>Gelişmiş>Css Ekle Kutusuna Aşağıdaki Kodları Ekliyoruz.

.label-size {display:inline-block; float:left; padding:7px; font:12px verdana; text-transform:uppercase; margin:0 4px 4px 0;}

.label-size a {color:#fff!important; text-shadow:0 1px 0 rgba(0, 0, 0, 0.5);}
.label-size a:hover {text-decoration:none;}

.label-size:nth-child(1) {background:#ff0000;}
.label-size:nth-child(2) {background:#cf650d;}
.label-size:nth-child(3) {background:#9e0963;}
.label-size:nth-child(4) {background:#f54e67;}
.label-size:nth-child(5) {background:#42ad9d;}
.label-size:nth-child(6) {background:#b3001b;}
.label-size:nth-child(7) {background:#5c3e31;}
.label-size:nth-child(8) {background:#8e4811;}
.label-size:nth-child(9) {background:#ff9900;}
.label-size:nth-child(10) {background:#097054;}
.label-size:nth-child(11) {background:#6599ff;}
.label-size:nth-child(12) {background:#461d7c;}
.label-size:nth-child(13) {background:#666666;}
.label-size:nth-child(14) {background:#00ff00;}
.label-size:nth-child(15) {background:#7c71ad;}
.label-size:nth-child(16) {background:#1eb6ff;}
.label-size:nth-child(17) {background:#898c17;}
.label-size:nth-child(18) {background:#000078;}
.label-size:nth-child(19) {background:#ffcc00;}
.label-size:nth-child(20) {background:#cc3333;}

.label-size:hover {opacity:0.6; -webkit-transition:0.5s; -moz-transition:0.5s; transition:0.5s;}

Kodların Boşluğuna Veya Yazılarına Dokunmayın !

Vee Eklentimiz Hazır Blogunuza Giderek Eklentiyi Kontrol Edin. Eklenti Hakkında Yorumlarınız Bekliyorum.

http://ibrakpinar.blogspot.com.tr/2015/05/blogger-etiketlerinizi-renklendirin.html