wordpress彩色标签云代码实现两大方法

   wordpress自带有标签云功能,在仪表盘中的小工具中直接添加就可以了。可是默认的显示,有很多朋友不太喜欢。我也很不喜欢,颜色一样,字体大小相差太远,排序看起来没有规则(默认是按字母升序排列,但对于中文博客来说不太实用。)

   下面就介绍一下,如何不用插件,实现彩色标签云,字体大小相差不多,排序按标签所包含的文章数量降序排列。就是本博客的右边的彩色标签云风格,如果你不喜欢这种风格话,本文也会介绍如何按照你喜欢的风格来调整。

   第一种方法：

    首先复制一份你博客主题的page.php模板

    然后在其顶部加入

<?php

/*

Template Name: Tags

*/

?>

     然后将这种显示正文内容的代码换成调用tags的代码

    <?php the_content(); ?>

    换成

    <?php wp_tag_cloud(‘smallest=12&largest=18&unit=px&number=0&orderby=count&order=DESC’);?>

    在style.css里面增加如下代码可以使得间距更好看：

#page-cnt.tags,

#page-cnt.friends { height: 576px; padding: 6px 0 0; overflow: hidden; line-height: 30px; }

#page-cnt.tags,

#page-cnt.friends { height: auto; padding-top: 5px; overflow: visible; }

.tags a { display: inline-block; margin: 0 4px; white-space: nowrap; }

    打开主题中的functions.php文件，在最末端的 ?>前面添加下面的代码，就可以实现彩色标签云了：

;

function colorCloud($text) {

$text = preg_replace_callback(‘|<a (.+?)>|i’,'colorCloudCallback’, $text);

return $text;

}

function colorCloudCallback($matches) {

$text = $matches[1];

$color = dechex(rand(0,16777215));

$pattern = ‘/style=(\’|\”)(.*)(\’|\”)/i’;

$text = preg_replace($pattern, “style=\”color:#{$color};$2;\”", $text);

return “<a $text>”;

}

add_filter(‘wp_tag_cloud’, ‘colorCloud’, 1);

    大功告成，在后台新建一个tags页面就可以了。

    第二种方法：

    第一步:实现wordpress彩色标签云。

    在你的主题文件夹中 functions.php 文件中加入以下代码:(位置随便但不能插到别的模块里去 )

    //Color Tag Cloud
    function colorCloud($text) {

    $text = preg_replace_callback('|<a (.+?)>|i', 'colorCloudCallback', $text);
    return $text;
    }
    function colorCloudCallback($matches) {
    $text = $matches[1];
    $color = dechex(rand(0,16777215));

    $pattern = '/style=('|")(.*)('|")/i';
    $text = preg_replace($pattern, "style="color:#{$color};$2;"", $text);
    return "<a $text>";
    }
    add_filter('wp_tag_cloud', 'colorCloud', 1);代码中

    $color = dechex(rand(0,16777215));作用是定义标签随机颜色的十进制数值范围,0 等于 #000000,16777215 等于 #ffffff,你也可以重定义标签云显示的颜色范围,只要查找出相应颜色的十六进制转换为相应的十进制就可以了。

    第二步:修改wordpress标签云字体大小,排序顺序,显示数量等。

    接下来,要修改wordpress程序用来控制显示标云的函数 wp_tag_cloud()

    该函数位置在 wp-includescategory-template.php 文件中,搜索 wp_tag_cloud 找到相关参数进行修改。

    找到默认的 wp_tag_cloud() 函数如下所示的位置:

    function wp_tag_cloud( $args = '' ) {
    $defaults = array(
    'smallest' => 8, 'largest' => 22, 'unit' => 'pt', 'number' => 45,

    'format' => 'flat', 'separator' => "n", 'orderby' => 'name', 'order' => 'ASC',
    'exclude' => '', 'include' => '', 'link' => 'view', 'taxonomy' => 'post_tag', 'echo'     => true
    );

    wp_tag_cloud() 函数参数解释:(主要改动这两行代码,其它不需要理会)'smallest' => 8, 'largest' => 22, 'unit' => 'pt', 'number' => 45,'format' => 'flat', 'separator' => "n", 'orderby' => 'name', 'order' => 'ASC',wp_tag_cloud() 函数参数使用举例:

修改成以下样式,显示效果就是本博客的标签云样式。

    'smallest' => 10, 'largest' => 14, 'unit' => 'pt', 'number' => 80,

    'format' => 'flat', 'separator' => "n", 'orderby' => 'count', 'order' => 'DESC',

smallest :设置标签云中显示的所有标签中,计数最少(最少文章使用)的标签字体大小,默认值为 8pt 。

    largest :设置标签云的所有标签中,计数最多(最多文章使用)的标签的字体大小,默认值为22pt。

    unit:标签文字字号的单位,默认为pt,可以为px、em、pt、百分比等;

    number :设置标签云中显示的最多标签数量,默认值为45个,设置为”0″则调用所有标签;

    format:调用标签的格式,可选”flat”、”list”和”array”,默认为”flat”平铺,”list”为列表方式;

    separator:(字符串)(可选)标签之间的文本/空格。默认值:’/n’ (空格);

    orderby :设置标签云中标签的排序方式,默认值为”name”按名称排序。如果设置成”count”则按关联的文章数量排列;

    order:排序方式,默认为”ASC”按正序,”DESC”按倒序,”RAND”按任意顺序;

    exclude:排除部分标签,输入标签ID,并以逗号分隔,如”exclude=1,3,5,7″不显示ID为1、3、5、7的标签;

    include :包含标签,与exclude用法一样,作用相反,如”include=2,4,6,8″则只显示ID为2、4、6、8的标签;

    ink 字符串)(可选)设置链接,允许编辑某个指定标签。有效值包括:’view’ (默认值)、 ‘edit’ ;

    taxonomy 字符串)(可选)用以生成云的分类法。’post_tag’将文章标签当作云的来源(默认值) 、’category’ 用文章分类生成云 、’link_category’用链接分类目录生成云;

    echo 布尔型)(可选)显示结果,或将结果保留在变量中。默认值为true(显示标签云)。有效值包括:1 (true) 默认值 、0 (false) 。

    提醒:以上标签参数皆可选,可自由搭配使用。

    第三步:wordpress彩色标签云小工具调用。

    修改完成后,直接在仪表盘的”外观―>小工具”中把”标签云”小工具拖动到右侧小工具中就可以了。

    也可以在主题文件夹中的 sidebar.php 添加下面这行代码调用。

    <?php wp_tag_cloud('smallest=10&largest=14&number=80'); ?>这三个参数上面都解释过了,这里不多说了。

    我自己的 wordpress博客不适合用这样的标签云，个人觉得默认普通标签看着也不错。