先看下效果吧，一梧叶的每篇文章右边都有一个96*96的透明图片，图片是跟文章正文内容的tag（标签）匹配的，当点击这个png图片时会转跳到含有这个tag的文章分类页面。Cnbeta大部分文章里面也带有这种功能的tag图片，国内著名的IT评论博客月光博客在文章列表页也有这种tag图片，但是月光博客的图片比较杂乱。

wordpress的tag添加png图标效果图

添加原理

给tag添加图片，是在上传好图片的情况下，根据tag名和图片的名称一一对应，每篇文章根据添加的一个自定义栏目tag_logo来控制要显示的图片。

具体步骤

1.添加图片

在wp-content文件夹下创建tag_logo文件夹，里面上传png图片，根据大小，我统一选择96*96的，注意文件名和tag名一致，大小写也一致，最好都用小写。比如本文的tag是wordpress，png则是wordpress.png。png图片可以到这个网站上去下载http://www.easyicon.cn/，里面广告少，搜索方便，高质量png图片也非常多，而且支持不同格式大小的png图片。

2.添加样式

在css文件最下面添加如下样式

#tag_logo
{
float: right; margin: 4px; padding: 0px; border: 0px;
padding: 0px;width:100px;height:100px;overflow:hidden; clear:both;
}

3.添加显示代码

在<?php the_content或者<?php the_excerpt前面添加如下代码

<!-- Tag Logo Begin -->
<!--?php if ( get_post_meta($post--->ID, 'tag_logo', true) ) { ?>
<!--?php $tag_logo = get_post_meta($post--->ID, 'tag_logo', true); ?>
<a href="<?php echo get_option('home'); ?>/tag/<?php echo $tag_logo; ?>/"><img id="tag_logo" src="<?php echo get_option('home'); ?>/wp-content/tag_Logo/<?php echo $tag_logo; ?>.png" alt="TAG:<?php echo $tag_logo; ?>" /></a><!--?php } else {?--><!--?php } ?-->
<!-- Tag Logo End -->

4.发布文章，添加自定义栏目

在发布文章的时候，在自定义栏目那里，新建一个栏目，名称是tag_log,值是标签的名称，比如这篇文章tag的wordpress。