这个3D标签云可不是N年前的那个Flash版的 wp-cumulus， 这个3D旋转标签云完全使用JS代码编写，很小只有几K，不用担心像垃圾Flash对资源的耗费。文章源自知更鸟-https://zmingcx.com/wordpress-3dcumulus.html
具体效果看本文的侧边栏标签云。文章源自知更鸟-https://zmingcx.com/wordpress-3dcumulus.html
下面以WordPress默认主题Twenty Fifteen为例，将这个炫酷的特效加到你的博客上。文章源自知更鸟-https://zmingcx.com/wordpress-3dcumulus.html
一，添加生成3D效果的脚本
将下载的3d.js脚本放到Twenty Fifteen主题js目录中。文章源自知更鸟-https://zmingcx.com/wordpress-3dcumulus.html
注：这个3D旋转标签云有两种效果的JS文件，我用的是第二种。文章源自知更鸟-https://zmingcx.com/wordpress-3dcumulus.html
打开Twenty Fifteen主题 functions.php 模板文件，在大约252行，添加：文章源自知更鸟-https://zmingcx.com/wordpress-3dcumulus.html
- wp_enqueue_script( '3d', get_template_directory_uri() . '/js/3d.js' );
或者直接将下面代码加到主题header模板文章源自知更鸟-https://zmingcx.com/wordpress-3dcumulus.html
- <script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/3d.js"></script>
二，添加样式
将下面的样式添加到主题style.css的最后即可：文章源自知更鸟-https://zmingcx.com/wordpress-3dcumulus.html
- #tag_cloud-2 {
- position:relative;
- height:340px;
- margin: 10px auto 0;
- }
- #tag_cloud-2 a {
- position:absolute;
- color: #fff;
- text-align: center;
- text-overflow: ellipsis;
- whitewhite-space: nowrap;
- top:0px;
- left:0px;
- padding: 3px 5px;
- border: none;
- }
- #tag_cloud-2 a:hover {
- background: #d02f53;
- display: block;
- }
- #tag_cloud-2 a:nth-child(n) {
- background: #666;
- border-radius: 3px;
- display: inline-block;
- line-height: 18px;
- margin: 0 10px 15px 0;
- }
- #tag_cloud-2 a:nth-child(2n) {
- background: #d1a601;
- }
- #tag_cloud-2 a:nth-child(3n) {
- background: #286c4a;
- }
- #tag_cloud-2 a:nth-child(5n) {
- background: #518ab2;
- }
- #tag_cloud-2 a:nth-child(4n) {
- background: #c91d13;
- }
三、修改对应选择器名称
比较麻烦点的是，其中 #tag_cloud-2 需根据不同情况加以修改，比如查看标签云小工具的网页源代码显示的是：文章源自知更鸟-https://zmingcx.com/wordpress-3dcumulus.html
- <aside id="tag_cloud-3" class="widget widget_tag_cloud">
- <h2 class="widget-title">标签</h2>
你就需要将 #tag_cloud-2改为#tag_cloud-3，同时将3d.js中的tag_cloud-2也改为tag_cloud-3.文章源自知更鸟-https://zmingcx.com/wordpress-3dcumulus.html
这个3D旋转标签云本身是支持低版本IE的，不过本例中配套的样式使用了CSS3特效，所以在低版本IE上标签背影色会不显示。文章源自知更鸟-https://zmingcx.com/wordpress-3dcumulus.html
JS源代码：来自互联网文章源自知更鸟-https://zmingcx.com/wordpress-3dcumulus.html
2015年8月30日 15点55分 1F
加上彩色就更好了。
2016年2月29日 12点48分 B1
@ 老杨 JS完全影响访问速度，不用
2015年8月30日 16点30分 2F
鸟哥，你这3d标签不适应啊，能搞个这种吗http://test.wpke.net
2015年8月30日 18点43分 B1
@ 飞越无限 嗯，确实没人家的好看，那就抄过来吧
2015年8月30日 22点10分 B2
@ 知更鸟 鸟哥，改版的分享下哈！
2015年8月30日 22点20分 B3
@ 飞越无限 整理后，会分享的
2015年9月7日 10点54分 B4
@ 知更鸟 鸟哥，这个很漂亮啊。其他主题应该也是可以的吧
2015年9月7日 11点05分 B5
@ 美Win网 是的
2015年8月30日 16点37分 3F
也是一个花哨功能呢，鼠标放上去不停的转，按理说鼠标放上去应该定位一下。。。一直转都不知道点哪个了。
2015年8月30日 18点44分 B1
@ 张戈博客 改成上面朋友建议的样式
2015年8月30日 19点02分 B1
@ 张戈博客 好像鼠标移动上去真的停不下来
2015年8月30日 20点58分 4F
N年前既视感！WP也时髦复古风啊！
2015年8月31日 00点09分 5F
晕，鸟哥，请问下 Begin 主题 代码要添加到 第几行呢？
2015年8月31日 14点03分 6F
看上去果然生动很多，有空我再试试
2015年8月31日 16点19分 7F
鸟哥 第二步 二，添加样式
是添加到begin主题还是Twenty Fifteen主题
2015年8月31日 18点34分 B1
@ 黑色理想 主题目前已集成该功能，还是升级一下吧
2015年9月21日 20点43分 B2
@ 知更鸟 我申请升级！
2015年8月31日 18点20分 8F
试试看怎么样
2015年9月1日 10点20分 9F
WordPress 3D旋转标签云效果还不错，用地球旋转标签云也很漂亮
2015年9月1日 10点55分 10F
鸟哥可否帮忙看一下我的博客，现在怎么好多的乱码？非常感谢！！！
http://www.yi510.com/
2015年9月7日 10点55分 B1
@ 关于爱情 打不开啊
2015年9月1日 17点55分 11F
3D 效果2 这个不错。
2015年9月2日 13点30分 12F
挺有趣的
2015年9月2日 20点39分 13F
一直想入手博主的主题，虽然网上也有一样一样的，但是对于博主，我认为购买正版才是最大的支持。不过现在有D8，也是正版，虽然D8的更新和售后不敢恭维，但是都花钱了。唉，等我再思考几天看看
2015年9月4日 12点16分 B1
@ 科研动力 不管怎么说，都不如正版的好，有能力还是选择正版比较给力
2015年9月2日 22点18分 14F
很炫彩的功能
2015年9月4日 09点45分 15F
鸟哥可否帮忙看一下我的的网站，JS还有没有修改的地方，感觉响应速度很慢。
http://www.toogooo.com/
2015年9月5日 14点36分 16F
个人觉得还是不要添加太多脚本
2015年9月7日 14点50分 17F
不错，谢谢分享，收下了！
2015年9月8日 14点21分 18F
也准备升级新版本了
2015年9月9日 18点04分 19F
鸟哥哥，HotNewspro主题能不能用这个3D标签！
2015年9月22日 08点30分 B1
@ 网赚博客 个人认为这个标签云跟主题无关的，只要是WordPress站点都可以用的
2015年9月24日 13点36分 20F
请问一下，为啥我的在firefox下面没效果。www.imallrushi.com
2015年9月24日 14点20分 21F
补充一下：ie也不支持，支持chromium
2015年9月27日 13点43分 22F
很实用，学习了。
2015年10月19日 20点13分 23F
没有看明白到底是怎么调用的呀？
2015年10月19日 20点33分 24F
站长非常厉害。看看我的效果http://www.mengshuaiku.com/
2015年10月28日 10点30分 25F
问下：这个主题的导航栏在下拉的时候能不能固定住？
2015年11月27日 21点06分 26F
很漂亮的一个小功能，等哪天有空了，也装上，美化一下网站！
2015年11月27日 22点06分 27F
qqqwwwwwww发的发的地方
2015年11月28日 15点41分 28F
好漂亮的标签云，mark
2015年11月29日 16点56分 29F
鸟哥请问点击下载后出现那个下载对话框是怎么实现的呀，还是文章里面3d.js下载那个css效果怎么做呢，谢谢
2015年12月12日 21点03分 30F
不错，用上了
2016年1月1日 16点59分 31F
恒不错
2016年1月5日 11点31分 32F
不知道为什么有问题，标签全部挤在一起，也不动。。http://www.lzyhll.com
2016年2月8日 23点07分 33F
首页的幻灯片在哪里设置，图片怎么上传？
2016年2月25日 12点10分 34F
效果不错，织梦里面也可以的
2016年3月25日 09点29分 35F
想问下这个会不会影响网站的seo效果呢?
2016年4月26日 21点41分 36F
这个功能好像好酷哟! 谢谢分享！
2016年7月8日 00点24分 37F
这个功能很炫酷，不过唯一的缺点是不能所有的页面都添加，百度搜索“WordPress不同的页面均可以添加3D旋转标签云方法”，实际上还是用的鸟叔的技术，供大家参考
2017年5月21日 13点10分 38F
请问Ality主题的如何加入这个3D旋转标签云？
2017年6月19日 12点13分 39F
我在我的博客上参照博主的方法尝试了下 没成功
2018年9月15日 17点37分 40F
儿歌