歲月留聲

WordPress 纯代码 自定义彩色标签云及简单优化配置

WordPress 自带标签云小工具,侧栏直接添加即可,就是默认样式有点平淡,可以加点代码实现彩色标签云及简单优化一下。

「WordPress 纯代码 自定义彩色标签云及简单优化配置:https://0xo.net/11」

WordPress 纯代码实现彩色标签云 可自定义颜色

代码丢到 WordPress 主题 functions.php 文件即可:

//彩色标签云 tag cloud
function theme_color_cloud_hook($text) {
$text = preg_replace_callback('|<a (.+?)>|i', 'color_cloud_callback', $text);
return $text;
}
function color_cloud_callback($matches) {
$text = $matches[1];
$colors = array('ea4335','4285f4','34a853','9c5c90','4D049F','430f02','800000','e60000');//自定义指定几种颜色
//$color = dechex(rand(0,16777215)); //黑色-> 白色 所有颜色 000000 -> FFFFFF
$color=$colors[dechex(rand(0,7))];//随机使用指定的几种颜色
$pattern = '/style=(\'|\")(.*)(\'|\")/i';
$text = preg_replace($pattern, "style=\"color:#{$color};$2;\"", $text);
return "<a $text>";
}
add_filter('wp_tag_cloud', 'theme_color_cloud_hook', 1);

可以根据主题实际适配自定义几种颜色,或者 dechex(rand(0,16777215)) 全彩色随机。侧栏标签云效果:

WordPress 纯代码 自定义彩色标签云及简单优化配置 - 第1张图片

「WordPress 纯代码 自定义彩色标签云及简单优化配置:https://0xo.net/11」

WordPress 标签云简单优化配置

代码丢到 WordPress 主题 functions.php 文件即可,按需修改:

/**
* 修改自带标签云 widget 字体大小
*/
//wp_tag_cloud 默认参数
//$defaults = array(
// 'smallest' => 8,//标签云中计数最少的标签字体大小,默认值为 8pt
// 'largest' => 22,//标签云中计数最多的标签字体大小,默认值为 22pt
// 'unit' => 'pt',//标签文字大小单位,默认为 pt,可以为 px、em、pt、百分比等
// 'number' => 45,//标签云中显示的最多标签数量,默认值为 45 个,0 则显示所有标签
// 'format' => 'flat',//标签输出格式,可选 flat、list 和 array,默认为 flat 平铺,list 为列表方式
// 'separator' => "\n",//标签之间分割文本/空格。默认值 /n (空格)
// 'orderby' => 'name',//标签排序方式,默认值 name 按名称排序,count 则按标签文章数量排序
// 'order' => 'ASC',//默认为 ASC 按正序,DESC 倒序,RAND 随机
// 'exclude' => '',//输入标签 ID 排除部分标签,如 exclude=1,3,5,7 不显示 ID 为 1、3、5、7 的标签
// 'include' => '',//包含标签,与 exclude 用法一样,作用相反。
// 'link' => 'view',
// 'taxonomy' => 'post_tag',//默认 post_tag 使用文章标签来生成数据 ;category 则用文章分类生成
// 'post_type' => '',//文章类型
// 'echo' => true,//默认值 true 打印显示标签云,0 或 false 则返回标签云数据
// 'show_count' => 0,//默认 0 不显示标签文章数量
//);
function twentytwelve_widget_tag_cloud_args( $args ) {
$args['largest'] = 18;
$args['smallest'] = 6;
$args['unit'] = 'pt';
$args['format'] = 'flat';
return $args;
}
add_filter( 'widget_tag_cloud_args', 'twentytwelve_widget_tag_cloud_args' );

//标签云 tag 新标签页打开
add_filter('wp_tag_cloud', 'blank_wp_tag_cloud');
function blank_wp_tag_cloud( $text ) {
return str_replace( '<a href=', '<a target="_blank" href=', $text );
}

「WordPress 纯代码 自定义彩色标签云及简单优化配置:https://0xo.net/11」
退出移动版