不用插件实现 WordPress 彩色标签云

solar @ 2009年05月26日 - 唉，你来晚一步，前 12 排已经被占啦 » - 1,341 Views

标签云用到的函数是

<?php wp_tag_cloud(); ?>

有以下几个主要参数：

smallest:最小字体,默认为8
largest:最大字体,默认为22
unit:字符大小的单位(例如pt,px,em),默认为pt
number:显示标签个数(为0时显示所有标签),默认为45
format:显示方式,flat(默认,以空格分隔)
更详细的说明请看 WordPress官方网站
以上各参数以"&"符号连接.不必都填,不填的参数以默认值为准.
根据上面的参数,调用标签云可以像这样:

<?php wp_tag_cloud('number=50&largest=24&smallest=12&unit=px'); ?>

实现彩色标签云的函数

//彩色标签云函数开始
function colorCloud($text) {
$text = preg_replace_callback('|<a (.+?)>|i', 'colorCloudCallback', $text);
return $text;
}
function colorCloudCallback($matches) {
$text = $matches[1];
$color = dechex(rand(0,16777215));
$pattern = '/style=(\'|\")(.*)(\'|\")/i';
$text = preg_replace($pattern, "style=\"color:#{$color};$2;\"", $text);
return "<a $text>";
}
add_filter('wp_tag_cloud', 'colorCloud', 1);

把上面的代码加入到模板文件的 functions.php 里即可。

效果参见本站的侧边栏和这里。

来源：wanwp.com 作者：冰古

标签：WordPress - 彩色 - 标签云
本文发表于 May 26, 2009，分属于“ WordPress ”频道，欢迎您评论或引用。
您还可以复制本文地址和好友分享 - 发送本文到 Twitter - 生成 TinyURL 短地址 - 生成 Bit.ly 短地址

This entry was posted on Tuesday, May 26th, 2009 at 1:22 pm and is filed under WordPress. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.

随机文章

12条评论在 “不用插件实现 WordPress 彩色标签云” 之后

1. crossyou @ Sun,Dec 20th,2009 16:08 PM 发表了评论：
不错的一个方法，谢谢了。

回复这条留言 - 引用
2. 创意无限 @ Wed,Nov 11th,2009 23:28 PM 发表了评论：
很好，用上了呵呵谢谢！

回复这条留言 - 引用
3. solar @ Mon,Nov 2nd,2009 22:22 PM 发表了评论：
@siory: 我只是转别人的代码，具体你是怎么操作的我不得而知，这个需要基本的php知识，其实也没那么复杂，再试试吧。我也爱莫能助，囧。

回复这条留言 - 引用
4. siory @ Sun,Nov 1st,2009 3:22 AM 发表了评论：
我加了“确实没有效果，怎么办。

回复这条留言 - 引用
5. solar @ Tue,Oct 20th,2009 16:10 PM 发表了评论：
@Eden: 给你的标签加 line-height 属性，以标签的最大字号为准。比如：你标签的最大字号为30px，那么就给包裹你标签的容器加个 line-height:30px 即可。

回复这条留言 - 引用
6. Eden @ Tue,Oct 20th,2009 12:51 PM 发表了评论：
为啥我的标签效果不好看，反而像是记作一团呢？

回复这条留言 - 引用
7. solar @ Wed,Aug 12th,2009 13:22 PM 发表了评论：
@Louis: 呵呵，这个东西的确意义不大，好玩儿而已吧~~~

回复这条留言 - 引用
8. Louis @ Wed,Aug 12th,2009 9:03 AM 发表了评论：
跑到binggu那里看了看留言，又不想加了

回复这条留言 - 引用
9. bingu @ Thu,May 28th,2009 0:19 AM 发表了评论：
@solar: 呵呵，加上就好了。

回复这条留言 - 引用
10. solar @ Wed,May 27th,2009 21:09 PM 发表了评论：
@bingu: 抱歉，在我搜索这个功能的时候，第一个看到是“有道快贴”里的文章，而这里没有给出任何作者的信息，因此我无从确认原始的作者及出处，你可以看一下我的其他文章只要是非原创的只要有确切的出处及作者信息我都会标明的。谢谢你的提醒我已经署名了。

回复这条留言 - 引用
11. bingu @ Tue,May 26th,2009 22:59 PM 发表了评论：
这个代码是我写的吧，根据CC也应该要留个链接吧。

回复这条留言 - 引用