效果展示

点击查看展示

修改代码分享(MWordStar主题修改page-tag.php文件，其它主题可以自己分析后修改)：

<?php
/**
 * 标签云
 * @package custom
 */

if (!defined('__TYPECHO_ROOT_DIR__')) exit;
$color = color($this->options->color);
$rounded = $this->options->rounded == 'rightAngle'?'rounded-0':'';  //  获取元素风格设置
$GLOBALS['page'] = 'page-tag';
$this->need('components/header.php');
?>

<div id="main" class="container tag-page main-content mb-0">
    <?php if ($this->options->breadcrumb == 'on'): ?>
        <nav aria-label="路径" class="breadcrumb-nav">
            <ol class="breadcrumb m-0 p-0">
                <li class="breadcrumb-item">
                    <a href="<?php $this->options->siteUrl(); ?>" class="<?php echo $color['link']; ?>">首页</a>
                </li>
                <li class="breadcrumb-item <?php echo $color['link']; ?>">
                    <?php $this->category(' '); ?>
                </li>
                <li tabindex="0" class="breadcrumb-item active" aria-current="page"><?php $this->title(); ?></li>
            </ol>
        </nav>
    <?php endif; ?>
    <div class="row">
        <div class="archive col-md-12 col-lg-8 col-sm-12 content-area">
            <main class="<?php echo $rounded; ?>">
                <header class="entry-header border-bottom">
                    <h2 class="entry-title p-name">
                        <a href="<?php $this->permalink() ?>"><?php $this->title() ?></a>
                    </h2>
                </header>
                <article>
                    <div class="post-content">     
                        <?php $this->widget('Widget_Metas_Tag_Cloud', 'sort=mid&ignoreZeroCount=1&desc=0&limit=200')->to($tags); ?>
                        <?php if($tags->have()): ?>
                            <div class="row">
                                <?php while ($tags->next()): ?>
                                    <span id="tag-clould-color"  style="background-color:rgb(<?php echo(rand(0,255)); ?>,<?php echo(rand(0,255)); ?>,
                    <?php echo(rand(0,255)); ?>)">
                                        <a role="listitem" target="<?php $this->options->sidebarLinkOpen(); ?>" data-toggle="tooltip" data-placement="top" href="<?php $tags->permalink(); ?>" rel="tag" class="<?php echo $color['link']; ?>" title="<?php $tags->count(); ?> 篇文章"><?php $tags->name(); ?> (<?php $tags->count(); ?>)</a>
                                   </span>
                                <?php endwhile; ?>
                            </div>
                        <?php else: ?>
                            <p class="text-center pb-2"><?php _e('没有任何标签'); ?></p>
                        <?php endif; ?>
                    </div>
                    <style>
#tag-clould-color {
    padding: 5px 10px 5px 10px;
    border-radius: 10px;
    color: #FFFFFF;
    margin: 6px 3px 3px 0;
    display: inline-block;
}
</style>
                </article>
            </main>
        </div>
        <?php $this->need('components/sidebar.php'); ?>
    </div>
</div>
<?php $this->need('components/footer.php'); ?>

说明

如果站点没有开启PJAX，需要删除以下代码:

id="main"