http://www.icyphoenix.com/viewtopic.php?f=28&t=7834&p=52673#p52673
-----------------------------------
nothere
Fri 13 May, 2011 03:39

Wordpress-like Tag Cloud Flash
-----------------------------------
I’ve always liked the plugin for Wordpress that animates tags in flash. You may have seen/heard of it, WP-Cumulus, see this link: http://wordpress.org/extend/plugins/wp-cumulus/ So, I thought I would make a block in CMS-->CMS Pages-->3 Columns.

It’s fairly easy. You just need to download a couple of files and edit the block relevant to your site.

To start, download the WP-Cumulus plugin from [url=http://wordpress.org/extend/plugins/wp-cumulus/]this link.
Extract the two files called: [b]swfobject.js[/b] and [b]tagcloud.swf[/b] then upload them to either the root of your IP site or create a new folder. Just remember to edit the paths accordingly (if in a different directory).

The original code can be found here, with a demo: http://www.roytanck.com/2008/03/06/wordpress-plugin-wp-cumulus-flash-based-tag-cloud/

Here is an example of what I placed on my site inside the CMS block.

[spoiler][code linenumbers=false]<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<title>WP-Cumulus example</title>
	<meta http-equiv="Content-Type" content="text/html" />
	<!-- SWFObject embed by Geoff Stearns geoff@deconcept.com http://blog.deconcept.com/swfobject/ -->
	<script type="text/javascript" src="swfobject.js"></script>
	<style type="text/css">
		body { background-color: #eee; padding: 20px; } 
	</style>

</head>

<body>

	<div id="flashcontent">This will be shown to users with no Flash or Javascript.</div>

	<script type="text/javascript">
		var so = new SWFObject("tagcloud.swf", "tagcloud", "600", "400", "7", "#ffffff");
		// uncomment next line to enable transparency
		//so.addParam("wmode", "transparent");
		so.addVariable("tcolor", "0x333333");
		so.addVariable("mode", "tags");
		so.addVariable("distr", "true");
		so.addVariable("tspeed", "100");
		so.addVariable("tagcloud", "<tags><a href='http://www.drm-cops.com/search.php?search_keywords=video' style='22' color='0xff0000' hicolor='0x00cc00'>video</a><a href='http://www.drm-cops.com/search.php?search_keywords=youtube' style='12'>youtube</a><a href='http://www.drm-cops.com/search.php?search_keywords=funny' style='16'>Funny</a><a href='http://www.drm-cops.com/search.php?search_keywords=computer' style='14'>Computer</a><a href='http://www.drm-cops.com/search.php?search_keywords=drm' style='12'>DRM</a><a href='http://www.drm-cops.com/search.php?search_keywords=windows' style='12'>Windows</a><a href='http://www.drm-cops.com/search.php?search_keywords=firefox' style='9'>Firefox</a><a href='http://www.drm-cops.com/search.php?search_keywords=interesting' style='10'>interesting</a><a href='http://www.drm-cops.com/search.php?search_keywords=google' style='10'>Google</a><a href='http://www.drm-cops.com/search.php?search_keywords=steam' style='12'>Steam</a><a href='http://www.drm-cops.com/search.php?search_keywords=sales' style='12'>Game Sales</a></tags>");
		so.write("flashcontent");
	</script>

</body>

</html>[/code][/spoiler]
Take note of the two script tags:
[code linenumbers=false]<script type="text/javascript" src="swfobject.js"></script>[/code]
and
[code linenumbers=false]<script type="text/javascript">
		var so = new SWFObject("tagcloud.swf", "tagcloud", "600", "400", "7", "#ffffff");[/code]
These contain the two files you uploaded to your site and where you would change the path if you created a separate directory for them.

All you need to do is edit the data between the <tag> and </tag>; i.e. replace keywords and the URLs for your site.

Here's the final result:

 [img]http://www.icyphoenix.com/files/images/8605/wp_tag.jpg[/img]

Suggestions and feedback are welcome.


