还记得以前刚用wp的3D标签云插件实现了3D效果,感觉很美观,当时也没有去多研究太多里面的调用什么的,而且是由FLASH组成的,对flash只有初步了解的我,还真看不出个所以然。
其实wordpress也差不多,只是调用函数不一样罢了。
现在转到点点了,以为不能用这个效果了,但是那天在模板公园看到有人用了,所以马上就把他给掰下来了...,且用在了我之前发布的monochrome免费主题上。
现在就在这里分享下调用的方法吧。
以下就是3D标签云的代码
div部分
<div id="Tags"></div>
把这个div放在你要实现的地方即可,当然你需要用css定位下才能是实现你需要的效果,比如我加载的css后的内容
<div id="Tags" class="width:200px;margin:-5px auto -15px;"></div>
然后就是主要的js部分啦
<script type="text/javascript" src="http://x.papaapp.com/farm1/9bd5eb/7759b4bb/A1BC4.js"></script>
<script type="text/javascript">
var rnumber = Math.floor(Math.random()*9999999);
var cloud = new SWFObject("http://x.papaapp.com/farm1/9bd5eb/d08ffe76/33D42.swf?r="+rnumber, "tagcloudflash", "200", "200", "9", "#000000");
var content;
cloud.addParam("wmode", "transparent");
cloud.addParam("allowScriptAccess", "always");
cloud.addVariable("tspeed", "120");
cloud.addVariable("mode", "tags");
cloud.addVariable("ncolor", "0x2Eaa00");
cloud.addVariable("distr", "true");
{?tags}
{?loop:tags}
content+=escape('<a href="{$tag.url}" >')+'{$tag.name}'+escape('</a>')
{/loop:tags}
{/tags}
cloud.addVariable("tagcloud", escape('<tags>')+content+escape('</tags>'));
cloud.write("Tags");
</script>
把以上部分放入body内就可以了。
值得一题的是,js的第4行中的“200”“200”为改标签云的长度和高度,后面的“#000000”为flash的背景颜色(目前暂未发现“9”是干嘛用的)可根据需要设定,第10行中的0x2Eaa00为标签云中标签的颜色代码,不知道是什么类型的,之前找了好久都不知道这个颜色代码怎么写的(这就是我现用的站点主题neutral一直没加上这个3D标签云的原因,也是一直没有发布这个教程的原因之一。。。),今晚终于找到一个对应的颜色表,顺便附上。
还有,由于本3D标签云是通过flash实现的,所以载入速度会慢点,可能会拖慢整个网站速度,大家权衡下利弊考虑加入与否。
"black"=>array( 0x000000),黑色
"maroon"=>array( 0x800000), 栗色
"green"=>array( 0x008000), 绿色
"olive"=>array( 0x808000), 橄榄色
"navy"=>array( 0x000080), 藏青色
"purple"=>array( 0x800080), 紫色
"teal"=>array( 0x008080), 凫蓝:适度或深色的带蓝色的绿色到呈绿色的蓝色
"gray"=>array( 0x808080), 灰色
"silver"=>array( 0xC0C0C0), 银色
"red"=>array( 0xFF0000), 红色
"lime"=>array( 0x00FF00),
"yellow"=>array( 0xFFFF00), 黄色
"blue"=>array( 0x0000FF), 蓝色
"fuchsia"=>array( 0xFF00FF), 紫红
"aqua"=>array( 0x00FFFF), 浅绿色
"white"=>array( 0xFFFFFF), 白色 Netscape and IE所附加定义的颜色
"aliceblue"=>array( 0xF0F8FF),
"antiquewhite"=>array( 0xFAEBD7),
"aquamarine"=>array( 0x7FFFD4),
"azure"=>array( 0xF0FFFF),
"beige"=>array( 0xF5F5DC),
"blueviolet"=>array( 0x8A2BE2),
"brown"=>array( 0xA52A2A),
"burlywood"=>array( 0xDEB887),
"cadetblue"=>array( 0x5F9EA0),
"chartreuse"=>array( 0x7FFF00),
"chocolate"=>array( 0xD2691E),
"coral"=>array( 0xFF7F50),
"cornflowerblue"=>array( 0x6495ED),
"cornsilk"=>array( 0xFFF8DC),
"crimson"=>array( 0xDC143C),
"darkblue"=>array( 0x00008B),
"darkcyan"=>array( 0x008B8B),
"darkgoldenrod"=>array( 0xB8860B),
"darkgray"=>array( 0xA9A9A9),
"darkgreen"=>array( 0x006400),
"darkkhaki"=>array( 0xBDB76B),
"darkmagenta"=>array( 0x8B008B),
"darkolivegreen"=>array( 0x556B2F),
"darkorange"=>array( 0xFF8C00),
"darkorchid"=>array( 0x9932CC),
"darkred"=>array( 0x8B0000),
"darksalmon"=>array( 0xE9967A),
"darkseagreen"=>array( 0x8FBC8F),
"darkslateblue"=>array( 0x483D8B),
"darkslategray"=>array( 0x2F4F4F),
"darkturquoise"=>array( 0x00CED1),
"darkviolet"=>array( 0x9400D3),
"deeppink"=>array( 0xFF1493),
"deepskyblue"=>array( 0x00BFFF),
"dimgray"=>array( 0x696969),
"dodgerblue"=>array( 0x1E90FF),
"firebrick"=>array( 0xB22222),
"floralwhite"=>array( 0xFxFAF0),
"forestgreen"=>array( 0x228B22),
"gainsboro"=>array( 0xDCDCDC),
"ghostwhite"=>array( 0xF8F8FF),
"gold"=>array( 0xFFD700),
"goldenrod"=>array( 0xDAA520),
"greenyellow"=>array( 0xADFF2F),
"honeydew"=>array( 0xF0FFF0),
"hotpink"=>array( 0xFF69B4),
"indianred"=>array( 0xCD5C5C),
"indigo"=>array( 0x4B0082),
"ivory"=>array( 0xFFFFF0),
"khaki"=>array( 0xF0E68C),
"lavender"=>array( 0xE6E6FA),
"lavenderblush"=>array( 0xFFF0F5),
"lawngreen"=>array( 0x7CFC00),
"lemonchiffon"=>array( 0xFFFACD),
"lightblue"=>array( 0xADD8E6),
"lightcoral"=>array( 0xF08080),
"lightcyan"=>array( 0xE0FFFF),
"lightgoldenrodyellow"=>array( 0xFAFAD2),
"lightgreen"=>array( 0x90EE90),
"lightgrey"=>array( 0xD3D3D3),
"lightpink"=>array( 0xFFB6C1),
"lightsalmon"=>array( 0xFFA07A),
"lightseagreen"=>array( 0x20B2AA),
"lightskyblue"=>array( 0x87CEFA),
"lightslategray"=>array( 0x778899),
"lightsteelblue"=>array( 0xB0C4DE),
"lightyellow"=>array( 0xFFFFE0),
"limegreen"=>array( 0x32CD32),
"linen"=>array( 0xFAF0E6),
"mediumaquamarine"=>array( 0x66CDAA),
"mediumblue"=>array( 0x0000CD),
"mediumorchid"=>array( 0xBA55D3),
"mediumpurple"=>array( 0x9370D0),
"mediumseagreen"=>array( 0x3CB371),
"mediumslateblue"=>array( 0x7B68EE),
"mediumspringgreen"=>array( 0x00FA9A),
"mediumturquoise"=>array( 0x48D1CC),
"mediumvioletred"=>array( 0xC71585),
"midnightblue"=>array( 0x191970),
"mintcream"=>array( 0xF5FFFA),
"mistyrose"=>array( 0xFFE4E1),
"moccasin"=>array( 0xFFE4B5),
"navajowhite"=>array( 0xFFDEAD),
"oldlace"=>array( 0xFDF5E6),
"olivedrab"=>array( 0x6B8E23),
"orange"=>array( 0xFFA500),
"orangered"=>array( 0xFF4500),
"orchid"=>array( 0xDA70D6),
"palegoldenrod"=>array( 0xEEE8AA),
"palegreen"=>array( 0x98FB98),
"paleturquoise"=>array( 0xAFEEEE),
"palevioletred"=>array( 0xDB7093),
"papayawhip"=>array( 0xFFEFD5),
"peachpuff"=>array( 0xFFDAB9),
"peru"=>array( 0xCD853F),
"pink"=>array( 0xFFC0CB),
"plum"=>array( 0xDDA0DD),
"powderblue"=>array( 0xB0E0E6),
"rosybrown"=>array( 0xBC8F8F),
"royalblue"=>array( 0x4169E1),
"saddlebrown"=>array( 0x8B4513),
"salmon"=>array( 0xFA8072),
"sandybrown"=>array( 0xF4A460),
"seagreen"=>array( 0x2E8B57),
"seashell"=>array( 0xFFF5EE),
"sienna"=>array( 0xA0522D),
"skyblue"=>array( 0x87CEEB),
"slateblue"=>array( 0x6A5ACD),
"slategray"=>array( 0x708090),
"snow"=>array( 0xFFFAFA),
"springgreen"=>array( 0x00Fx7F),
"steelblue"=>array( 0x4682B4),
"tan"=>array( 0xD2B48C),
"thistle"=>array( 0xD8BFD8),
"tomato"=>array( 0xFF6347),
"turquoise"=>array( 0x40E0D0),
"violet"=>array( 0xEE82EE),
"wheat"=>array( 0xF5DEB3),
"whitesmoke"=>array( 0xF5F5F5),
"yellowgreen"=>array( 0x9ACD32));
搞定收工。。。

(加个图使列表页效果好看点...)
ps:限定标签个数用{#sys:tags.number|value:"10"}定义即可。