怎么才能实现Zblog首页摘要的tag图文混排

由 willer 发布

我们在使用Zblog的时候,除了简洁容易操作,还希望能美化一下自己的博客页面,其中首页摘要的tag图文混排是不少人选择的一种形式,下面,我们就来简单介绍下,如何通过模板文件的代码修改来实现这个效果


操作步骤和代码编写如下:

首先:将zblog模板文件TEMPLATE/b_atricle_tag.html其中的代码替换为以下代码内容


<img src="<#ZC_BLOG_HOST#>logo/<#article/tag/intro#>.gif" alt="<#article/tag/name#>" class="thumb" />


如果要实现图片超链接,在上面的内容中加入相关超链接代码即可


然后:修改当前zblog模板的TEMPLATE/b_article-multi.html文件


修改前原代码

 <div class="post-body"><#article/intro#></div>


修改后代码


<div class="post-body"><#template:article_tag#><#article/intro#></div>


第三步:进入z-blog博客后台的Tags管理,给每个Tags标签增加一个摘要,内容为一个英文单词,用于图片文章名


第四步:在zblog的根目录下建一个文件夹,并命名为logo,将上面tags命名的文件名增加.gif后缀复制到该目录


第五步:编辑当前zblog模板目录STYLE下的css文件,添加以下css样式代码


div.post-body img.thumb {

     float: right;

     margin: 4px 4px 4px 4px;

     padding: 0px;

     border: 0px;

     padding: 0px;

     max-width: 500px;

     max-height:500px;

     overflow:hidden;

     clear:both;

}


第六步:进入博客后台,重建文件,显示z-blog首页摘要tag图文混排效果。