注册
登录
| 关键词： 文章 Blog 文件 标记 内容 default 一个 TAG 图片 摘要 |
本文介绍如何为Z-Blog添加文章缩略图，由于Z-Blog现在为止还没有文章缩略图的相关插件，所以我们只能通过利用Z-Blog程序里的TAG相关标记来实现这一功能。目前有两种方法可用，分别是调用<#template:article_tag#>标记和<#article/firsttagintro#>标记，两种方法都各有利弊，前一种可以在缩略图上设置TAG链接但每篇文章只能有一个TAG，后者每篇文章可以拥有多个TAG但就不能在缩略图上设置链接。 方法一：调用<#template:article_tag#>标记实现文章缩略图功能 1、打开Z-Blog目录下的THEMES/default/TEMPLATE/b_article_tag.html文件，将内容更改为：<a href="<#article/tag/url#>" rel="tag"><img src="<#ZC_BLOG_HOST#>logo/<#article/tag/name#>.webp" alt="<#article/tag/intro#>" class="thumb" /></a>，上面红色文字为添加内容。 2、打开Z-Blog目录下的THEMES/default/TEMPLATE/b_article-multi.html文件，将原来的<div class="post-body"><#article/intro#></div>修改为<div class="post-body"><#template:article_tag#><#article/intro#></div>，上面红色文字为添加内容。然后把下面的一行<h5 class="post-tags"><#ZC_MSG138#>: <#template:article_tag#></h5>删除掉。 3、打开Z-Blog目录下的HEMES\default\STYLE\default.css文件，找到div.post-body这一块，在后面添加以下内容： div.post-body img.thumb { border:0px solid #666; float: right; margin: 10px 10px 10px 10px; padding: 0px; padding: 0px; max-width: 500px; max-height:500px; overflow:hidden; clear:both; } 4、进入Z-Blog的Tags管理，给每个Tags增加一个摘要，内容可以为英文或拼音缩写，用于图片名称。接着在Z-Blog根目录下新建一个logo文件夹，以后文章的TAG缩略图就上传到这里（缩略图命名格式为xxxx.gif，红色部分是Tags的摘要名称）。 5、完成以上内容修改后，在Z-Blog后台选择“文件重建”即可生效。 提示：使用<#template:article_tag#>标记实现文章缩略图，每篇文章只能有一个TAG，每个TAG都要有一个对应的图片文件，并且是GIF格式的图片。 方法二、调用<#article/firsttagintro#>标记实现文章缩略图功能 1、打开Z-Blog目录下的THEMES/default/TEMPLATE/b_article-multi.html文件，将原来的<div class="post-body"><#article/intro#></div>修改为<div class="post-body"><img src="<#ZC_BLOG_HOST#>/logo/thumb_<#article/firsttagintro#>.webp" class="thumb" /><#article/intro#></div>，上面红色文字为添加内容。 2、打开Z-Blog目录下的HEMES\default\STYLE\default.css文件，找到div.post-body这一块，在后面添加以下内容： div.post-body img.thumb { border:0px solid #666; float: right; margin: 10px 10px 10px 10px; padding: 0px; padding: 0px; max-width: 500px; max-height:500px; overflow:hidden; clear:both; } 3、进入Z-Blog的Tags管理，给每个Tags增加一个摘要，内容可以为英文或拼音缩写，用于图片名称。接着在Z-Blog根目录下新建一个logo文件夹，以后文章的TAG缩略图就上传到这里（缩略图命名格式为thumb_xxxx.gif，红色部分是Tags的摘要名称）。 4、完成以上内容修改后，在Z-Blog后台选择“文件重建”即可生效。 提示：使用<#article/firsttagintro#>标记实现文章缩略图，每篇文章支持多个TAG，多TAG文章将默认显示第一个TAG缩略图。该标记在Z-Blog 1.8 Walle Build 100427版本中才添加的，所以在以前的旧版本中不适用。 方法三、提取文章中的第一张图片作为文章摘要配图 这是Z-Blog的一个首页摘要文章图片显示插件，名叫FirstIMG。通过该插件，Z-Blog可以实现首页每篇文章自动显示文章的第一张图片。 1、百度搜索并下载“FirstIMG插件”，解压后在Z-Blog后台上传安装，安装后点击启用该插件。 2、打开Z-Blog目录下的THEMES/default/TEMPLATE/b_article-multi.html文件，将原来的<div class="post-body"><#article/intro#></div>修改为<div class="post-body"><#xiaoyi/first/img#><#article/intro#></div>，上面红色文字内容为该插件的功能标记。 3、完成以上内容修改后，在Z-Blog后台选择“文件重建”即可生效。 文章最后补充： 1、本所以文章中说到的文件路径、CSS风格都是默认的。根据使用的主题不同，可能网页代码会有所差异，但是修改的文件和原理都是一样的。 2、在使用中要确保各TAG摘要有一个对应的缩略图片，TAG摘要如果是英文还需要大小写要同缩略图片名字相同，防止在LINUX主机上出现无法调用的情况。 3、在CSS文件修改部分，大家可以根据自己的喜好随意定制，如缩略图的位置、大小、图片加框等特效。 4、如果想要在文章页也显示缩略图，可以参照上文方法将标记添加到Z-Blog目录下的THEMES/default/TEMPLATE/b_article-single.html文件中即可。 |
|
声明：文章版权归原作者所有 部分文章转自互联网 如有侵权请联系
[邮箱地址] 删除
|
