Blogger'da Gadget Kullanmadan 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.
Blogger Etiketleri Listeleme Kodu
<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}