Что может быть ужасней ситуации, когда твоя девушка, по-детски умиляясь и временами пуская слюни, пересматривает какой-нибудь смазливый сериал из своего  детства про смазливых школьников? Когда глаза ее, затуманенные ностальгической поволокой, трепетно внимают глубокомысленным героям, озабоченным отсутствием растительности на подбородке или проблемами бесчисленных прыщей?

Нет, определенно это выдержит не каждый. Не стал исключением и я, когда в один из дней и моя девушка решила всплакнуть под говяненький сериальчик "Мятежный дух", виденный ею еще в пору образования первых веснушек. Первое время все ее восторги и воспоминания я переносил мужественно и беззвучно, подобно тихому и домашнему хомячку, лениво глядящему с нижней полки на все прихоти хозяев, суетящихся где-то там вверху. Но, видимо, к концу дня во взгляде у меня все же отразилось что-то такое, что заставило ее от греха подальше переместиться на кухню и продолжить просмотр там, неспешно совмещая его с мелкой уборкой. Вследствие чего занимаемое ею помещение периодически наполнялось вздохами, сдержанными смешками и признаниями юной Хуаны Марии и не менее юного Педро де Лусии. Сопереживает, значит она, думалось мне язвительно, но, тем не менее, облегченно.

Эх, я еще не знал тогда всей пользы таких ностальгических экскурсов в детство! По окончанию просмотра, когда довольная душа моей романтической девушки была увлажнена страстями молодых сериальных страдальцев, комната нашей кухни приобрела горделивое лицо торгового дома IKEA, важно блестя уютными, прибранными полочками и приборами. На плите призывно дымился аппетитный и томный ужин, что мне захотелось расплакаться от счастья; даже пустая и одинокая солонка, заброшенная в последние дни из-за, э, пусть будет нашей занятости, была аккуратно заполнена и теперь добродушно блестела керамическим боком мне со стола. Вот я сейчас думаю, может ей подкинуть второй сезон, если он существует, или напомнить с мечтательной непринужденностью о других ее мыльных ностальгиях детства?

Ну да лады. Я счастлив побочным эффектом плаксивых девчушек из сериальной жизни. Мы же сегодня поговорим об установке облака тегов в блог. К сожалению, у Blogger эта функция выглядит достаточно неказисто и, как все родное, требует доработки. К чему мы немедленно и приступим. Попробуем немного украсить гаджет тегов и придать ему более аристократичный вид. В итоге должно получится примерно то, что вы можете лицезреть на этом блоге в колонке справа. В отличие от flash-облаков тегов, ему не требуется наличие в браузере у пользователя включенной поддержки flash.

Первое, что нужно сделать, это добавить в шаблон блога родной виджет ярлыков от Blogger, если таковой у вас отсутствует. Для этого на странице Дизайн в шаблон включаем новый элемент HTML/JavaScript - Ярлыки.
Следующим действием переходим во вкладку "Изменить HTML" и определяем стили CSS для будущего творения. Установка требует "ковыряния" HTML-кода, поэтому не стесняйтесь сохранить его резервную копию на локальный диск перед сотворением чуда, да и профилактики ради. После чего с помощью сочетания клавиш CTRL+F в браузере находим отрезок кода:

]]></b:skin>

Сразу перед ним добавляем стили:

/* Label Cloud Styles */
#labelCloud {text-align:center;font-family:arial,sans-serif;}
#labelCloud .label-cloud li{display:inline;background-image:none !important;padding:0 5px;margin:0;vertical-align:baseline !important;border:0 !important;}
#labelCloud ul{list-style-type:none;margin:0 auto;padding:0;}
#labelCloud a img{border:0;display:inline;margin:0 0 0 3px;padding:0}
#labelCloud a{text-decoration:none}
#labelCloud a:hover{text-decoration:underline}
#labelCloud li a{}
#labelCloud .label-cloud {}
#labelCloud .label-count {padding-left:0.2em;font-size:9px;color:#000}
#labelCloud .label-cloud li:before{content:"" !important}

Далее мы ищем другой отрезок кода в шаблоне:

</head>

Опять же, перед ним добавляем код:

<script type='text/javascript'>
// Label Cloud User Variables
var cloudMin = 1;
var maxFontSize = 20;
var maxColor = [122,109,85];
var minFontSize = 10;
var minColor = [0,0,0];
var lcShowCount = false;
</script>

Гордимся собой и сохраняем шаблон. И тут же переходим ко второй стадии установки. Процесс снова будет проходить непосредственно в шаблоне блога во вкладке "Изменить HTML", но теперь уже отмечаем галочкой "Расширить шаблоны виджетов". И снова поиски. Так как мы установили родной облако ярлыков от Blogger, о чем я просил раньше, ищем в шаблоне начало этого виджета, то есть примерно такую строчку:

<b:widget id='Label1' locked='false' title='Labels' type='Label'>

Виджет оканчивается строкой:

</b:widget>

Беззастенчиво удаляйте все ненужное, заключенное между этими тегами. Теперь набиваем новой начинкой наше облако тегов. Вместо удаленного вписываем следующий код, это значит, что разместиться он у вас также между найденными тегами <b:widget id='Label1' locked='false' title='Labels' type='Label'/> и </b:widget>:

<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'>

// Don't change anything past this point -----------------
// Cloud function s() ripped from del.icio.us
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 = "<data:label.name/>";
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('labelCloud');
ul = document.createElement('ul');
ul.className = 'label-cloud';
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);
li = document.createElement('li');
li.style.fontSize = fs+'px';
li.style.lineHeight = '1';
a = document.createElement('a');
a.title = ts[t]+' Posts in '+t;
a.style.color = 'rgb('+c[0]+','+c[1]+','+c[2]+')';
a.href = '/search/label/'+encodeURIComponent(t);
if (lcShowCount){
span = document.createElement('span');
span.innerHTML = '('+ts[t]+') ';
span.className = 'label-count';
a.appendChild(document.createTextNode(t));
li.appendChild(a);
li.appendChild(span);
}
else {
a.appendChild(document.createTextNode(t));
li.appendChild(a);
}
ul.appendChild(li);
abnk = document.createTextNode(' ');
ul.appendChild(abnk);
}
lc2.appendChild(ul);  
</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>

В итоге остается только сохранить шаблон. И если все сделано правильно и с воодушевлением, то с этих самых пор у вас в блоге должно появиться симпатичное облако тегов. Если же надобность в нем отпадет, вы в любое время сможете удалить его, просто убрав тот элемент HTML/Javascript, в котором он обитает. Виджет уже настроен, но вы можете облагородить его по своему вкусу. Для этого привожу значения, указанные в скрипте, размещенном перед строкой /head, которые поддаются дрессировке: