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
this link.
Extract the two files called:
swfobject.js and
tagcloud.swf 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/...ased-tag-cloud/
Here is an example of what I placed on my site inside the CMS block.
<?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>
Take note of the two script tags:
<script type="text/javascript" src="swfobject.js"></script>
and
<script type="text/javascript">
var so = new SWFObject("tagcloud.swf", "tagcloud", "600", "400", "7", "#ffffff");
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:
Suggestions and feedback are welcome.
