Typecho各种设置标签云的教程

4.2
(6)

又是一篇老站的教程,文章提到Typecho设置标签云,随机颜色、固定颜色的标签设置。今天,在数据库找到这篇文章还可以,就分享出来,适当修改(函数调用部分修改)可以用作Wordpress的彩色标签等。

Typecho各种设置标签云的教程

本教程讲述了Typecho如何设置标签云,包括彩色标签云,标签云字体根据文章数目大小自动调节,这些都靠几个函数实现。

函数

随机颜色代码

color:#<?php echo substr(md5(rand()), 0, 6); ?>;

固定颜色代码

color:#<?php echo substr(md5($tags->name), 0, 6); ?>;

根据标签文章个数调整字体大小代码

font-size:<?php echo log($tags->count)*50+100; ?>%;

整数字体大小

font-size:<?php printf("%u%%", log($tags->count)*50+100); ?>

完整代码

    <style>.widget-list-tag li{display:inline-block;list-style:none;font-family:monospace;margin:1px;padding:1px;}</style>
    <?php $this->widget('Widget_Metas_Tag_Cloud', 'sort=name&ignoreZeroCount=1&desc=0&limit=30')->to($tags); ?>
    <ul class="widget-list widget-list-tag">
        <?php if($tags->have()): ?>
        <?php while ($tags->next()): ?>
           <li><a style="font-size:<?php printf("%u%%", log($tags->count)*50+100); ?>; color:#<?php echo substr(md5($tags->name.'rand'), 0, 6); ?>;" href="<?php $tags->permalink(); ?>" title="<?php $tags->count(); ?> 个话题"><?php $tags->name(); ?></a></li>
        <?php endwhile; ?>
        <?php else: ?>
           <li><?php _e('没有任何标签'); ?></li>
        <?php endif; ?>
    </ul>

本站代码

    <?php $this->widget('Widget_Metas_Tag_Cloud', 'sort=name&ignoreZeroCount=1&desc=0&limit=30')->to($tags); ?>
    <div class="widget-list widget-list-tag">
        <?php if($tags->have()): ?>
        <?php while ($tags->next()): ?>
           <span class="tag-one"><a style="color:#<?php echo substr(md5($tags->name.'rand'), 0, 6); ?>;" href="<?php $tags->permalink(); ?>" title="<?php $tags->count(); ?> 个话题"><?php $tags->name(); ?></a></span>
        <?php endwhile; ?>
        <?php else: ?>
           <span class="tag-one"><?php _e('没有任何标签'); ?></span>
        <?php endif; ?>
    </div>

参考

参考链接如下所示:http://luly.lamost.org/blog/typecho_tag_cloud.html

本站舍弃了上述教程中的 <ul><li></li></ul> 布局样式,改为采用 <div><span></span></div> ,完美的实现了样式自动适配主题,现在将教程发出来,感谢各位支持。关于采用本站提供的标签云方法设置前后,本站的改变如下。

共计6人评分,平均4.2

到目前为止还没有投票~

很抱歉,这篇文章对您没有用!

让我们改善这篇文章!

告诉我们我们如何改善这篇文章?

文章目录

旧站文章,作者:古哥,如若转载,请注明出处:https://iymark.com/articles/451.html

(0)
微信公众号
古哥的头像古哥管理团队
上一篇 2020年10月18日 14:38
下一篇 2020年10月18日 22:56

你可能感兴趣的文章

发表回复

登录后才能评论
微信小程序
微信公众号