Paylaşan Admin

28 Ocak 2019 Pazartesi

Blogger Renkli Etiketler Eklentisi

Blogger Renkli Etiketler Eklentisi 2019

#blogger #renklietiket #etiket #eklenti


Merhaba arkadaşlar, #blogger #blog umuzu daha iyi bir görünüme kavuşturmak için bir kaç küçük eklenti ile nasıl daha iyi hale getirebiliriz düşüncesiyle yola çıkarak ilk eklenti olarak "Renkli Etiketler" eklentisini sizinle paylaşmaya karar verdim

Eklentiye geçmeden önce aşağıda ki eklentilerde hoşunuza gidebilir,
Blogger Yorum Kutusundan Önce E-Posta Abonelik Eklentisi
Blogger Sade ve Şık İletişim Formu Eklentisi

• İlk olarak Blogger > Tema > HTML Düzenle'ye tıklıyoruz.
• CTRL+F ile "</head>" kodunu aratıyoruz ve aşağıda ki kodu bir satır üzerine ekliyoruz.

<style type='text/css'> /*cemozergungor.com Renkli Etiketler Eklentisi*/ .post-labels{float:left;display:block;width:100%;color:#999} .post-labels a{float:left;height:24px;line-height:24px;position:relative;font-size:12px;margin-left:12px;padding:0 10px;background:rgba(0,0,0,0.25);color:#fff;text-decoration:none;border-bottom-right-radius:3px;border-top-right-radius:3px} .post-labels a:before{content:"";float:left;position:absolute;top:0;left:-12px;width:0;height:0;border-color:transparent rgba(0,0,0,0.25) transparent transparent;border-style:solid;border-width:12px 12px 12px 0} .post-labels a:after{content:"";position:absolute;top:10px;left:-1px;float:left;width:4px;height:4px;border-radius:2px;background:#fff;transition:all .3s} .post-labels a:nth-child(1){background:#ca85ca} .post-labels a:nth-child(1):before{border-color:transparent #ca85ca transparent transparent} .post-labels a:nth-child(2){background:#e54e7e} .post-labels a:nth-child(2):before{border-color:transparent #e54e7e transparent transparent} .post-labels a:nth-child(3){background:#61c436} .post-labels a:nth-child(3):before{border-color:transparent #61c436 transparent transparent} .post-labels a:nth-child(4){background:#f4b23f} .post-labels a:nth-child(4):before{border-color:transparent #f4b23f transparent transparent} .post-labels a:nth-child(5){background:#46c49c} .post-labels a:nth-child(5):before{border-color:transparent #46c49c transparent transparent} .post-labels a:nth-child(6){background:#607ec7} .post-labels a:nth-child(6):before{border-color:transparent #607ec7 transparent transparent} .post-labels a:nth-child(7){background:#ca85ca} .post-labels a:nth-child(7):before{border-color:transparent #ca85ca transparent transparent} .post-labels a:nth-child(8){background:#e54e7e} .post-labels a:nth-child(8):before{border-color:transparent #e54e7e transparent transparent} .post-labels a:nth-child(9){background:#61c436} .post-labels a:nth-child(9):before{border-color:transparent #61c436 transparent transparent} .post-labels a:nth-child(10){background:#f4b23f} .post-labels a:nth-child(10):before{border-color:transparent #f4b23f transparent transparent} </style>

• Daha sonra "<span class='post-labels'>" kelimesini aratıyoruz ve "<div class='post-footer-line post-footer-line'> " (sonu 1-2-3 olabilir) blogunun altında ki ;

<span class='post-labels'> <b:if cond='data:top.showPostLabels and data:post.labels'> <data:postLabelsLabel/> <b:loop values='data:post.labels' var='label'> <a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='not data:label.isLast'>,</b:if> </b:loop> </b:if> </span>

• BU KODU KOMPLE AŞAĞIDA Kİ KODLA DEĞİŞTİRİYORUZ

<b:if cond='data:blog.pageType == &quot;item&quot;'> <span class='post-labels'> <div id='maia-signature'/> <b:if cond='data:post.labels'> <span style='float: left;'>Tags: </span><b:loop values='data:post.labels' var='label'> <a expr:href='data:label.url + &quot;?max-results=6&quot;' expr:title='data:label.name' rel='tag nofollow'><data:label.name/></a> </b:loop> </b:if> </span> </b:if>

ve kaydediyoruz. 
İşlem tamamlanmıştır, herhangi bir paylaşımınızın içerisinde olup olmadığına bakıp kontrol edebilirsiniz.Yapamazsanız, bir hata ile karşılaşırsanız yorumda belirtirseniz yardımcı olmaya çalışırım

Bunu Paylaş :