Wednesday, March 3, 2010

How to make Flash - tag cloud to Blogspot.com


I want to share with you how I - an inexperienced blogger, decided to create an animated flash tag cloud. Thoroughly studied several articles I finally got what I wanted. An example of such a flash tag clouds, you can see on my page.

Installing
  1. First you need to download an archive file (mirror). Unzip the file and save to some sort of file-hosting service (for example, I have all my files are stored on fileave.com),



    you can also use my links, but note that I can delete all your files and all over than you were working away, so it is better to count on myself)
  2. Go to Settings / Layout / Edit HTML. I strongly recommend that before you change, save a copy of the template for this need to click to download a copy of the template and save it in a safe place). Then, using the keys Ctrl + F to find a line and immediately after the insert here so here's the code for your widget:
<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://mysqltools.fileave.com/blog-tools/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://mysqltools.fileave.com/blog-tools/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>




The text highlighted in red is the address of files that need to be replaced by your.

Customize

1. The width and height of the block tag clouds (240 and 300 by default). Changes are here:

var so = new SWFObject ( "http://path_to_file/tagcloud.swf", "tagcloud", "240", "300", "7", "# ffffff");

2. Background color:

var so = new SWFObject ( "http://path_to_file/tagcloud.swf", "tagcloud", "240", "300", "7", "# ffffff");

3. Text color:

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

Pay attention to what format the code of color, it is without the # character.

0 Comments:

Post a Comment