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');
里面的颜色值可以根据自己爱好调整。
评论前必须登录!
立即登录 注册