Tuesday 17 February 2009

Blogumus – анимированный виджет Облако тегов для Blogger

Установка Blogumus в формат блога, удивительно просто! Вам необходимо только скопировать и вставить фрагмент кода в шаблон блога, хотя для каких-либо настроек стиля отображения потребует некоторых ручное редактирование. Вот шаги, необходимые для установки Blogumus в блог верстка: Переход к макету> Изменить HTML В блогах панели приборов, и найти следующию строку кода

<b:section class='sidebar' id='sidebar' preferred='yes'>

Сразу после этой кода ,скопировать и вставить следующий фрагмент кода:

<b:widget id='Label99' locked='false' title='Labels' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<script src='http://halotemplates.s3.amazonaws.com/wp-cumulus-example/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></div>
<script type='text/javascript'>
var so = new SWFObject(&quot;http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf&quot;, &quot;tagcloud&quot;, &quot;240&quot;, &quot;300&quot;, &quot;7&quot;, &quot;#ffffff&quot;);
// uncomment next line to enable transparency
//so.addParam(&quot;wmode&quot;, &quot;transparent&quot;);
so.addVariable(&quot;tcolor&quot;, &quot;0x333333&quot;);
so.addVariable(&quot;mode&quot;, &quot;tags&quot;);
so.addVariable(&quot;distr&quot;, &quot;true&quot;);
so.addVariable(&quot;tspeed&quot;, &quot;100&quot;);
so.addVariable(&quot;tagcloud&quot;, &quot;<tags><b:loop values='data:labels' var='label'><a expr:href='data:label.url' style='12'><data:label.name/></a></b:loop></tags>&quot;);
so.addParam(&quot;allowScriptAccess&quot;, &quot;always&quot;);
so.write(&quot;flashcontent&quot;);
</script>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>

Затем можно сохранить шаблон,и потом изменять цвета и размеры, как требуется.


При этом установки по умолчанию, Blogumus включает следующие предустановки переменных:

* Width is set to 240px Ширина установлен 240px
* Height is set to 300px; Высота установлен 300px;
* Background color is white Цвет- цвет белый
* Test color is grey Тест -цвет серый
* Font size is "12" Размер шрифта "12"

Я рассмотрю эти варианты в порядке их появления в код виджета. Изменение ширины и высоты переменные для ширины и высоты можно найти в этой строке скрипта:

var so = new SWFObject("http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf", "tagcloud", "240", "300", "7", "#ffffff");

Ширина (в настоящее время 240) выделен красным цветом, в то время как высота (по умолчанию 300px) выделен синим цветом. Эти числовые значения указавают ширину и высоту в пикселях, так что вы можете изменить это как захотите. Изменение цвета фона можно изменить цвет фона с белого на любой другой цвет, изменяя шестнадцатиричное значение в одной строке:

var so = new SWFObject("http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf", "tagcloud", "240", "300", "7", "#ffffff");

Например, если вы предпочитаете яркие красном фоне, вы можете заменить # FFFFFF с # ff0000. Измените цвет текста по умолчанию, набор текста на дисплее, как темно-серый (шестнадцатиричное значение # 333333). Вы можете изменять эту переменную в следующей строке:

so.addVariable("tcolor", "0x333333");

Имейте в виду, что "tcolor" является Flash переменные и не включает в себя обычный хеш символ шестнадцатеричный цвет кодов. Не забудьте только заменить номера! Регулировка размера шрифта Максимальный размер шрифта в теги, указанные в этой строке:

"<tags><b:loop values='data:labels' var='label'><a expr:href='data:label.url' style='12'><data:label.name/></a></b:loop></tags>");

Вы можете изменить на большие или меньших шрифты, если вы захотите, измените "12", чтобы увеличить или уменьшить число.


* This source code was highlighted with Source Code Highlighter.

No comments:

Post a Comment