Web Günlüğü - Anasayfa
Web Günlüğü

blogger ipuçları, eklentileri ve temalarının yer aldığı web günlüğü


bu bloğu izle

Bumerang - Yazarkafe

Olist Blogger Teması
canlı radyo dinle

Blogger'da Gadget Kullanmadan Etiketleri Listeleme

10 Eylül 2017 Pazar - #
blogger etiketleri listeleme
Blogger'da etiketleri listelemek için Etiketler gadget'i (Blogger tabiliriyle) kullanılabiliyor. Fakat gadget desteği olmayan temalarda veya istenilen yerde ve sayfalarda etiketleri listelemek için alternatiflere yönelmek gerekiyor. Bu alternatifler birisi de javascript kullanarak etiketleri istenilen yerde listelemek.

Bizzat bloğumda test etmiş olduğum aşağıdaki kod ile etiketler sabit sayfalarda da listeleniyor. Kodun eksik bir yönü bulunuyor o da etikete ait kaç adet yazının olduğunu göstermemesi. Onun haricinde aşağıdaki kodlar nerede kullanılmak isteniyorsa oraya eklenerek etiketler listelenebilir ve vermiş olduğum diğer CSS kodları isteğe göre değiştirilip, geliştirilebilir.

<script type='text/javascript'>
//<![CDATA[
function showLabels(json) {
    var label = json.feed.category;
    document.write(' <div id="labels">');
    document.write('<ul>');
    for (var i = 0; i < label.length; i++) {
      document.write('<li class="' + label[i].term + '"><a href="/search/label/' + label[i].term + '?max-results=9" data-filter=".' + label[i].term + '">' + label[i].term + '</a></li>');
    }
  document.write('<span class="show_ico icon-remove"/>');
    document.write('</ul>');
  document.write('</div><div style="clear:both"></div>');
}
document.write('<scr' + 'ipt src="/feeds/posts/summary?max-results=0&alt=json-in-script&callback=showLabels"><\/scr' + 'ipt>');
//]]>
</script>

CSS kodları
#labels{margin-bottom:20px; display:block}
#labels ul {list-style:none; margin:0; padding:0; text-align:left;} 
#labels ul li {list-style:none; text-align:left; float:left; padding:5px; border-radius: 3px; box-shadow: 0 1px 0 rgba(0,0,0,.05);
background-color: #ffffff; color: #353535; border: 1px solid rgba(0,0,0,.15); margin:3px; font-size:12px} 



Yorumlar

  1. hocam bu kodları nere ekleyeceğiz birde bende senin temanı kullanıyorum gelmiş geçmiş en iyi tema ama bu tema içinde github ile ilgili link var onu kaldırsak zarar olur mu

    YanıtlaSil
  2. halettim ama tüm etiketler çıktı ben sadece belirli etikerler çıkmasını istiyorum

    YanıtlaSil
    Yanıtlar
    1. Bu kodlarla tüm etiketler listeleniyor. Belirli etiketler seçilip gösterilemiyor maalesef.

      Sil
  3. hocam o zaman kullanamam galiba bence çok etiket var o zaman her yeri kaplar genede sağol eline sağlık hocam

    YanıtlaSil
  4. Teşekkürler. Muhteşem bir yazı olmuş
    .

    YanıtlaSil

İletişim Formu

Ad

E-posta *

Mesaj *