WordPress 图文混排之显示分类图标
关注园子博客的朋友们一定注意到了在文章内容页面的开始部分左侧多了一个分类图标,右侧投放了 AdSense 广告,这样的图文混排效果可以在一定程度上更加益于阅读,并适当的提高广告的点击率。
这个灵感得益于园子经常关注的月光博客,月光在文章内容页右侧放置了 TAG 图标,左侧是 adsense 广告,但月光使用的是 zblog ,所以他分享的方法并不适用于 wordpress 用户,园子在网上经过一番搜寻,最后借鉴了 zEUS 的方法实现了 WordPress 图文混排显示分类图标的效果。和月光博客有所区别的是我调用的分类图标,月光使用的是 TAG 图标。实现效果如下:
Wordpress 图文混排之显示分类图标
实现显示分类图标的过程:
1.准备好你的每个分类所对应的图片,图片名字一定要采用对应分类的缩略名,分类的缩略名可以在后台看到,最好全部使用英文。
2.在/wp-content/目录建立一个 cat-icons 文件夹,将图片文件全部上传至此文件夹下。
3.打开你想添加分类图标对应的主题文件,如想在首页出现需修改 index.php 文件,在文章页面出现需要修改 single.php 文件,查找类似如下代码:
<?php the_content(); ?>
在这段代码前面加上下面的代码:
1 2 3 4 5 6 7 8 9 10 11 12 | <?php foreach((get_the_category()) as $cat) { $catname =$cat->category_nicename; $cattitle=$cat->cat_name; echo "<a href=/category/"; echo $catname; echo "/>"; echo "<img src=http://www.yzznl.cn/wp-content/cat-icons/"; echo $catname; echo ".gif alt=\"$catname category \" title=\"$cattitle\" /></a>\n"; } ?> |
园子需要提醒你的是,如果你的分类永久链接形式没有采用默认的 “http://yourdomain/category/分类名” 形式,你需要更改第五行的代码 “/category/ ”为正确的路径。
4.实现左浮动或右浮动。你只需要在上述代码外层加个 div 容器,然后通过 css 定义就可以了。
最后需要提醒你的是,实现此方法最好一篇文章只有一个分类,如果拥有多个分类会将多个图片都显示出来。想看具体的图文混排效果,可以直接参看园子的博客。
本文参考文章:
再次感谢 zEUS 。

