菠蘿教你做模板之五－圖片頻道的模板制作

2024-09-10 07:17:32

字體：大中小

來源：轉載

供稿：網友

菠蘿教你做模板之五－圖片頻道的模板制作

前面我們已經講過了文章、下載頻道的模板制作，今天講完圖片頻道之后，剩下的就是專題的制作，雖然每個頻道都有專題，但是制作方法都是一樣的，我們講集中講解。好，閑話不說，開始講課。

打開picture/index.html文件，我們就會發現都是我們前面講過很熟悉的標簽，圖片頻道與別的頻道最大的不同，就是在顯示的時候默認顯示的都是縮略圖，也就是我們看到的這一串標簽

{$picpicture(0,$channelid,$cat[catid],1,0,0,10,30,0,0,0,3,1,0,130,100,5)}

因此我們主要來講這個標簽的制作，別的頂級欄目。終極欄目的制作和文章頻道都是相同的

在picture文件夾下面以tag開頭的文件有4個
tag_picpicture.html 圖片縮略圖調用標簽
tag_picturelist.html 圖片標題列表調用標簽
tag_slidepicpicture.html 圖片幻燈片調用標簽
tag_slidepicpicture-js.html 圖片js效果標簽模板

打開tag_picpicture.html，我們會看到
{loop $pictures $i $picture}

$i是用來判定幾列的
利用這個i來和系統設置的$cols 做比較
利用他們的余數來判定是否分行

<img src='{$picture[thumb]}' alt='{$picture[alt]}' width='{$imgwidth}' height='{$imgheight}'> 這里面就是你在發布圖片時候選的縮略圖的大小
<a href='{$picture[url]}' target='_blank' title='{$picture[alt]}'[/color]>{$picture[title]}</a>

這幾個分別是圖片的地址圖片的提示圖片的標題

{if $descriptionlen}
<tr>
<td>{$picture[content]} <a href='{$picture[url]}' target='_blank'>具體>></a></td>
</tr>
{/if}

這一句是，假如答應顯示說明，則顯示具體的說明信息

在tag_picturelist.html中，顯示的東西則比縮略圖模板要多
{$picture[img]} 標題圖片
{$picture[catname]} 所屬欄目
<a href="{$picture[url]}" title="{$picture[alt]}" target="{$picture[target]}" class="tag_title_link{$picture[fonttype]}">{$picture[title]}</a> 圖片標題及路徑
{if $showhits}({$picture[hits]}){/if} 假如答應顯示點擊數，則顯示點擊數
{if $showauthor}[作者:{$picture[author]}]{/if} 顯示作者
{if $datetype}[<span class="tag_date">{$picture[adddate]}</span>]{/if} 顯示添加時間
{if $descriptionlen}{$picture[content]}{/if} 顯示說明

圖片內容頁content.html的制作
打開這個網頁
<script language=javascript type=text/javascript>
function fontZoom(size)
{
document.getElementById('{$addtime}l').style.fontSize=size 'px'
}
var pictureurl=new Array();
var picturename=new Array();
{loop $pictureurls $id $pic}
pictureurl[{$id}] = "{$pic[url]}";