方法一
| 代码如下 | 复制代码 |
|
打开 functions.php 文件，插入以下代码 //彩色标签云 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); |
|
可以直接在需要调用标签云的模板中加入代码
| 代码如下 | 复制代码 |
|
<?php wp_tag_cloud(); ?> |
|
上面红色部分的代码 $color = dechex(rand(0,16777215));用来定义标签随机颜色的十进制数值范围,0 等于 #000000,16777215 等于 #ffffff,建议重定义下，随机的颜色有可能跟你的网页背景色相同，会让用户看不清是什么字。在photoshop中定位好颜色范围后，使用系统自带的计算机即可把16进制转换成十进制数。
方法二
| 代码如下 | 复制代码 |
|
<?php function cloud_tag() ?> |
|
方法三
打开当前主题的functions.php文件，加入以下代码：
| 代码如下 | 复制代码 |
|
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); |
|
然后在需要显示彩色标签云的地方加入以下调用代码：
| 代码如下 | 复制代码 |
|
<?php wp_tag_cloud('smallest=8&largest=24&number=50'); ?> |
|
参数说明：
smallest=8&largest=24&number=50
8表示字号、字体大小。
24表示调用最热门的24个标签。
50表示一共输出50个标签。
上面三种彩色标签云效果如果直接把css定义在了htm中了，像我就不喜欢这样我喜欢分离一，
方法四
我们需要添加css样式，在style.css文件后面添加以下的样式代码，标签的间距就会好看些。
| 代码如下 | 复制代码 |
| #page-cnt.tags, #page-cnt.friends { height: 576px; padding: 6px 0 0; overflow: hidden; line-height: 30px; } #page-cnt.tags, #page-cnt.friends { height: auto; padding-top: 5px; overflow: visible; } .tags a { display: inline-block; margin: 0 4px; white-space: nowrap; } |
|
添加彩色功能
打开主题中的functions.php文件，在最末端的 ?>前面添加下面的代码，就可以实现彩色标签云了：
| 代码如下 | 复制代码 |
|
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); |
|
发布Tags页面
上传到Tstyle主题根目录，到后台新建一个页面，在右边的“页面属性”选择Tags模板文件，不用填写任何内容，直接发布这个页面，就可以看到tags页面啦。
到这里为止，你就可以看到你的标签云页面啦。
注：侧边栏的标签云可以也使用下面的代码直接调用：
| 代码如下 | 复制代码 |
| <?php wp_tag_cloud('smallest=12&largest=18&unit=px&number=20');?> | |
好了总结一下，从上面四种方法来看个人更喜欢最后一种，因为了喜欢把css定义在页面中维护也麻烦哦。