小鸟数据生成标签云的代码应该是仿自默认的纯白主题,为了显示彩色标签,所以为tags增加了几个随机的类,事实上这几个类完全可以利用jquery在前端添加,毕竟现在用户的电脑性能远远超过了自己小水管服务器的性能,php添加随机类的写法:
<?php $this->widget('Widget_Metas_Tag_Cloud', 'sort=mid&ignoreZeroCount=1&desc=0&limit=60')->to($tags); ?>
<?php
$tagsColor = array(
'tag-primary',
'tag-success',
'tag-danger',
'tag-warning',
'tag-info',
'tag-dark'
);
?>
<?php while ($tags->next()): ?>
<a title="<?php $tags->count(); ?> 篇文章" href="<?php $tags->permalink(); ?>" class="<?php echo $tagsColor[mt_rand(0, 5)]; ?>"><?php $tags->name(); ?>(<?php $tags->count(); ?>)</a>
<?php endwhile; ?>
新的主题需要在搜索框里显示若干个热门的标签,所以需要重新调整一下排序,把sort的标准更改为count,同时需要限制一下标签的数量,搜索的同时有耐心看标签的应该不多,6~8个应该够了:
<?php $this->widget('Widget_Metas_Tag_Cloud', 'sort=count&ignoreZeroCount=1&desc=0&limit=6')->to($tags); ?>
不需要对数据进行改动的时候,比如像博主一样准备把随机类名的工作交给jquery处理的,可以把上述语句简化为这样,这是一个去掉了数量显示,按标签数量排列,仅输出8个标签的版本:
<?php $this->widget('Widget_Metas_Tag_Cloud', 'sort=count&ignoreZeroCount=1&desc=0&limit=8')->parse('<a title="{count} 篇文章" class="hottag-list-item" href="{permalink}">{name}</a>'); ?>
最初的那段程序的修改版本:
<?php $this->widget('Widget_Metas_Tag_Cloud', 'sort=mid&ignoreZeroCount=1&desc=0&limit=60')->parse('<a title="{count} 篇文章" href="{permalink}">{name}({count})</a>'); ?>
前端利用jquery来为元素添加随机的类名:
let tagClass=['tag-primary','tag-success','tag-danger','tag-warning','tag-info','tag-dark'];
$('#hottag-list a').addClass(
function(){
return tagClass[Math.floor(Math.random()*tagClass.length)];
});