blogger etiket bulutu

temayı değiştirdiğimde sağdaki etiket bulutu çok uzun çıkdı 4 senedir dünya kadar etiket koymuşum bunları adam gibi gösterim dedim başladım aranmaya. güzel bir makale buldum ama bu sefer rengi boyu stili beni açmadı onu biraz değiştirdim benim sağdaki etiket bulutu kıvamına getirdim.

sağdaki gibi bir etiket bulutu oluşturmak için yapmanız gerekenler.

1- Bloggerdaki blogunuzun yönetim panelinden Layout -> Edit HTML e gelin ordaki Expand Widget Templates i tıklayın ve aşağıda görünen kodu kopyalayıp yedekleyin sonra başka bir editörde açın.

2- </b:skin> ile </head> arasına bu kodu

<script type='text/javascript'>
var cloudMin = 1;
var maxFontSize = 30;
var maxColor = [0,151,202];
var minFontSize = 10;
var minColor = [255,255,255];
var lcShowCount = false;
</script>

ekleyin.

3- <b:widget id='Label1' ile başlayan satırı bulun bu bizim işte etiket bulutumuzu oluşturan widget. bu widgetı baştan sona aşağıdaki kod ile değiştirin.

<b:widget id='Label1' locked='false' title='Etiketler' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>

<div class='widget-content'>
<div id='labelCloud'/>
<script type='text/javascript'>

function s(a,b,i,x){
if(a&gt;b){
var m=(a-b)/Math.log(x),v=a-Math.floor(Math.log(i)*m)
}
else{
var m=(b-a)/Math.log(x),v=Math.floor(Math.log(i)*m+a)
}
return v
}


var c=[];
var labelCount = new Array();
var ts = new Object;
<b:loop values='data:labels' var='label'>
var theName = &quot;<data:label.name/>&quot;;
ts[theName] = <data:label.count/>;
</b:loop>

for (t in ts){
if (!labelCount[ts[t]]){
labelCount[ts[t]] = new Array(ts[t])
}
}
var ta=cloudMin-1;
tz = labelCount.length - cloudMin;
lc2 = document.getElementById(&#39;labelCloud&#39;);

for(var t in ts){
if(ts[t] &lt; cloudMin){
continue;
}
for (var i=0;3 &gt; i;i++) {
c[i]=s(minColor[i],maxColor[i],ts[t]-ta,tz)
}
var fs = s(minFontSize,maxFontSize,ts[t]-ta,tz);

a = document.createElement(&#39;a&#39;);
a.title = ts[t]+&#39; Posts in &#39;+t;
a.style.fontSize = fs+&#39;px&#39;;
a.style.color = &#39;rgb(&#39;+c[0]+&#39;,&#39;+c[1]+&#39;,&#39;+c[2]+&#39;)&#39;;
a.href = &#39;/search/label/&#39;+encodeURIComponent(t);
if (lcShowCount){
a.appendChild(document.createTextNode(t));
}
else {
a.appendChild(document.createTextNode(t));
}
abnk = document.createTextNode(&#39; &#39;);
lc2.appendChild(a);
lc2.appendChild(abnk);
}
</script>

<noscript>
<ul>
<b:loop values='data:labels' var='label'>
<li>
<b:if cond='data:blog.url == data:label.url'>
<data:label.name/>
<b:else/>
<a expr:href='data:label.url'><data:label.name/></a>
</b:if>
(<data:label.count/>)
</li>
</b:loop>
</ul>
</noscript>
<b:include name='quickedit'/>
</div>

</b:includable>
</b:widget>


arada çıkabilecek arızalar:

1- bu etiket bulutunu kendi kodunuzda bulamamış olabilisiniz. blogger layout dan page element olarak tag cloud sayfanıza eklemiş olun.
2- renkleri beğenmemiş olabilirsiniz ki ben kendi temama göre açık maviden beyaza doğru açtım. etiket bulutu renk şemasını değiştirmek için yapmanız gereken. ikinci maddede eklediğimiz script bölgesindeki maxColor ve minColor değişkenleriyle oynamanız gerekiyor.

Comments

Popular posts from this blog

Postgresql group by day, week and month examples

Next (2007)

Spring-boot vs Quarkus