понедельник, 30 августа 2010 г.
Анимированное облако тегов Blogumus.
Недавно наткнулся у кого-то в блоге на анимированное облако тегов, так называемый Blogumus, и не смог удержаться от соблазна прикрутить себе в блог такой же. Мучился три ночи, потому что информации в интернете много, но она везде одна и та же, да еще и устаревшая. В одном блоге наткнулся на локализованный вариант такого облака, но он у меня не прикрутился:( Поднапрягся и нашел более менее оптимальный вариант для себя.
Для тех,у кого нет ни ярлыков, ни гаджета "Ярлыки":
идем в меню Отправка->Изменить сообщение:
и создаем ярлыки для своих статей (ключевые слова, на которых завязаны статьи).
ВНИМАНИЕ: так как Blogumus , по неизвестной мне причине, не отображает кириллицу, то я поступил так-ваш ярлык записываем латинскими буквами и символами, так чтобы ярлык был похож на русское слово.Например:
}l{upHble ccbl^ku
cKpunT
BuD}|{eT
Cu^a 6^oroB - здесь нет ни одной русской буквы,только латинские и символы!
o|oaBuKoH
pacKpyTKa
6ecn^aTHo
Смотрим как это отображается у меня. Немного фантазии и все получится :)
Далее идем в меню Дизайн ->Элементы страницы. Выбираем место, где расположим свое облако->Добавит гаджет:
В верхней строчке называем гаджет (облако тегов или метки). Сохраняем. Далее переходим на Изменить HTML, ставим галочку Расширенные шаблоны виджета, нажимаем CTR+F и вставляем примерно такую строчку:
<b:widget id='Label1' locked='false' title='НАЗВАНИЕ' type='Label'>-где название,это название вашего гаджета.Видим примерно это:
<b:widget id='Label2' locked='false' title='НАЗВАНИЕ' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<ul>
<b:loop values='data:labels' var='label'>
<li>
<b:if cond='data:blog.url == data:label.url'>
<span expr:dir='data:blog.languageDirection'>
<data:label.name/>
</span>
<b:else/>
<a expr:dir='data:blog.languageDirection' expr:href='data:label.url'>
<data:label.name/>
</a>
</b:if>
<span dir='ltr'>(<data:label.count/>)</span>
</li>
</b:loop>
</ul>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>
После строчки выделенной красным и до </b:widget>(включительно)выделяем и удаляем.
Вместо этого вставляем это:
<b:includable id='main'><b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<script src='http://files.main.bloggerstop.net/uploads/3/0/2/5/3025338/swfobject.js' type='text/javascript'/>
<div id='flashcontent'>Blogumulus by <a href='http://www.roytanck.com/'>Roy Tanck</a> and <a href='http://www.bloggerbuster.com'>Amanda Fazani</a> via <a href='http://bloggerstop.net'>BloggerStop.Net</a></div>
<script type='text/javascript'>
var so = new SWFObject("http://files.main.bloggerstop.net/uploads/3/0/2/5/3025338/tagcloud.swf", "tagcloud", "220", "200", "8", "#ccffff");
// uncomment next line to enable transparency
//so.addParam("wmode", "transparent");
so.addVariable("tcolor", "0x0000ff");
so.addVariable("mode", "tags");
so.addVariable("distr", "true");
so.addVariable("tspeed", "300");
so.addVariable("tagcloud", "<tags><b:loop values='data:labels' var='label'><a expr:dir='data:blog.languageDirection' expr:href='data:label.url' style='13'><data:label.name/></a></b:loop></tags>");
so.addParam("allowScriptAccess", "always");
so.write("flashcontent");
</script>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>
Нажимаем просмотр, если видим положительный результат, то идем дальше, меняем настройки виджета:
-зеленым отмечены ширина и высота виджета;
-красным, цвет текста;
-синим, цвет фона;
таблицу цветов и оттенков можете посмотреть на этом сайте http://hydra.nac.uci.edu/indiv/franklin/doc/html.colors.html
-эта строчка отвечает за скорость вращения so.addVariable("tspeed", "300");
Опять нажимаем просмотр, любуемся и сохраняем шаблон.Вот как этот код выглядет у меня:
Анимированное облако тегов Blogumus.
2010-08-30T06:25:00+03:00
Unknown
облако|Blogumus|
Подписаться на:
Комментарии к сообщению (Atom)