如何利用dede标签云生成多彩多姿的tag标签？

dede标签云如何生成不同颜色、不同大小的tag标签

在织梦CMS（DedeCMS）中，通过简单的代码修改和函数添加，可以轻松实现生成不同颜色、不同大小的Tag标签，本文将详细解释如何通过修改模板文件和加入自定义函数来实现这一功能。

步骤一：选择页面模板并添加代码

1、选择首页模板：通常需要在首页index.htm上进行修改。

2、添加标签云代码：

“`html

<!— /下面开始tag标签云 —>

<div>

<dl class="tbox light"> <dt><strong>Tags标签云</strong></dt>

<dd>{dede:tag row=’45’ getall=’1′ sort=’hot’}

<a href='[field:link/]’ title="[field:tag /]([field:total /])" style="[field:total runphp=yes]@me=getTagStyle();[/field:total]">[field:tag /]</a>

{/dede:tag}

</dd>

</dl>

</div>

<!— /tag标签云结束 —>

“`

步骤二：在common.func.php文件中添加自定义函数

1、打开文件：找到include/common.func.php文件。

2、添加getTagStyle函数：

“`php

function getTagStyle() {

$minFontSize = 8; //最小字体大小,可根据需要自行更改

$maxFontSize = 18; //最大字体大小,可根据需要自行更改

return ‘fontsize:’ . ($minFontSize + lcg_value() * (abs($maxFontSize $minFontSize))) . ‘px;color:#’ . dechex(rand(0, 255)) . dechex(rand(0, 196)) . dechex(rand(0, 255));

}

“`

3、自定义字体大小数组（如果需要指定几个固定大小）：

“`php

function getTagStyle() {

$sizearray = array(‘8’, ‘9’, ’10’, ’11’, ’12’, ’20’); //自定义字体大小,可根据需要自行修改

return ‘fontsize:’ . $sizearray[rand(0, count($sizearray))] . ‘pt;color:#’ . dechex(rand(0, 255)) . dechex(rand(0, 196)) . dechex(rand(0, 255));

}

“`

步骤三：生成HTML并查看效果

1、生成HTML：在后台生成相应的HTML页面。

2、查看效果：刷新首页，可以看到标签云中的每个标签都有不同的颜色和大小。

示例效果图

以下是一个示例效果图，展示了不同颜色和大小的标签云：

Tags标签云
热门 [标签1] [标签2] [标签3] ...

相关问答FAQs

问题1：如何更改标签云的最小和最大字体大小？

解答：可以通过修改getTagStyle函数中的$minFontSize和$maxFontSize变量来调整最小和最大的字体大小，如果你想把最小字体大小改为10，最大字体大小改为24，可以这样修改：

function getTagStyle() {
    $minFontSize = 10; //最小字体大小,可根据需要自行更改
    $maxFontSize = 24; //最大字体大小,可根据需要自行更改
    return 'fontsize:' . ($minFontSize + lcg_value() * (abs($maxFontSize  $minFontSize))) . 'px;color:#' . dechex(rand(0, 255)) . dechex(rand(0, 196)) . dechex(rand(0, 255));
}

问题2：如何指定只显示某些固定的颜色和字体大小？

解答：可以通过修改getTagStyle函数，使用预定义的字体大小和颜色数组，如果你只想显示几种固定的颜色和字体大小，可以这样修改：

function getTagStyle() {
    $sizearray = array('10', '12', '14', '16', '18'); //自定义字体大小,可根据需要自行修改
    $colorarray = array('FE9901', '68B338', '0077B6', 'CC0000', 'FF8C00'); //自定义颜色,可根据需要自行修改
    return 'fontsize:' . $sizearray[rand(0, count($sizearray))] . 'pt;color:#' . $colorarray[rand(0, count($colorarray))];
}

这样，标签云中的每个标签将会随机从这些预定义的字体大小和颜色数组中选择样式。

参数/选项	说明	示例代码
	循环遍历标签数组
// PHP代码计算标签大小和颜色	使用PHP代码动态计算每个标签的大小和颜色	`

$size = ceil(5 + ($tag[‘num’] / max($tags[‘num’])) * 30); // 根据标签出现次数计算大小

$color = ‘#’.dechex(rand(0, 0xFFFFFF)); // 随机生成颜色值

</php>` |

|size='size' | 设置标签的大小，单位为像素 |size="${size}px" |

|style="color: ${color};" | 设置标签的文字颜色 |style="color: ${color};" |

|<a href="/tags${tag['tagid']}.html">${tag['tagname']}</a> | 标签的链接，将标签名作为URL的一部分 |<a href="/tags${tag['tagid']}.html">${tag['tagname']}</a> |

|</volist> | 结束循环 |</volist> |

示例代码片段：

<volist name="tags" id="tag">
    <php>
        // PHP代码计算标签大小和颜色
        $size = ceil(5 + ($tag['num'] / max($tags['num'])) * 30); // 根据标签出现次数计算大小
        $color = '#'.dechex(rand(0, 0xFFFFFF)); // 随机生成颜色值
    </php>
    <a href="/tags${tag['tagid']}.html" style="color: ${color};" size="${size}px">${tag['tagname']}</a>
</volist>

在这个示例中，size属性根据标签的出现频率来调整标签的大小，而color属性则通过PHP代码生成一个随机颜色，这样，每个标签都会有一个随机的大小和颜色，从而在页面上形成一个动态的标签云。