WordPress通过自定义代码小工具实现圆角彩色标签云 纯代码实现

WordPress默认的标签云样式不怎么美观，颜色也有些单调。本站使用的DUX主题的“DUX 标签云”也是中规中矩，本来想要修改成彩色的标签，只是网上搜索测试了半天，也没有成功。后来找到一个教程，直接修改WordPress小工具自带的标签云，通过自定义代码，完美实现彩色标签。而且这种方式，理论上不只适用于dux主题，其他的主题应该也是可行的。

操作方法

在当前主题的functions.php，dux主题为functions-theme.php文件加入以下代码：

/* 彩色静态标签云 Color Tag Cloud 
/* -------------------------------- */
function colorCloud($text) {
  $text = preg_replace_callback('|<a (.+?)>|i', 'colorCloudCallback', $text);
  $text=preg_replace('/<a /','<a ',$text);
  return $text;
}
function colorCloudCallback($matches) {
  $text = $matches[1];
//这里定义我们背景色的范围，如果不想设置背景色的输出范围我们可以使用
//$color = dechex(rand(0,16777215));从所有颜色中随机出一个
  $a = array('8D7EEA','F99FB2','AEE05B','E8D368','F75D78','55DCAB','F75DB1','ABABAF','7EA8EA');
  $co = array_rand($a,2);
  $color = $a[$co[0]];
//随机颜色代码结束，下面开始吧颜色赋值给每个标签生成背景色
  $pattern = '/style=(\'|\")(.*)(\'|\")/i';
  $text = preg_replace($pattern, "style=\"background:#{$color};\"", $text);
  return "<a $text>";
}
//把php代码挂载到wp_tag_cloud钩子上
add_filter('wp_tag_cloud', 'colorCloud', 1);

然后到WordPress后台，通过外观——小工具——标签云，添加后就能看到效果了。

注：这里的“标签云”是指WordPress自带的，而非当前你所使用主题的标签云！！！

其中上面代码中的：

$a = array('8D7EEA','F99FB2','AEE05B','E8D368','F75D78','55DCAB','F75DB1','ABABAF','7EA8EA');

里面的颜色值可以根据自己爱好调整。