phpcms图片频道模板制作
<p><strong>phpcms图片频道的模板制作</strong><br><br><span>前面我们已经讲过了文章、下载频道的模板制作，今天讲完图片频道之后，剩下的就是专题的制作，虽然每个频道都有专题，但是制作方法都是一样的，我们讲集中讲解。好，闲话不说，开始讲课。</span><br><br><span>打开picture/index.html文件，我们就会发现都是我们前面讲过很熟悉的标签，图片频道与别的频道最大的不同，就是在显示的时候默认显示的都是缩略图，也就是我们看到的这一串标签</span><br><br><span>{$picpicture(0,$channelid,$cat,1,0,0,10,30,0,0,0,3,1,0,130,100,5)}</span><br><br><span>因此我们主要来讲这个标签的制作，别的顶级栏目。终极栏目的制作和文章频道都是相同的</span><br><br><span>在picture文件夹下面以tag开头的文件有4个</span><br><span>tag_picpicture.html 图片缩略图调用标签</span><br><span>tag_picturelist.html 图片标题列表调用标签</span><br><span>tag_slidepicpicture.html 图片幻灯片调用标签</span><br><span>tag_slidepicpicture-js.html 图片js效果标签模板</span><br><br><span>打开tag_picpicture.html，我们会看到</span><br><span>{loop $pictures $i $picture} </span><br><br><span>$i是用来判断几列的</span><br><span>利用这个i来和系统设置的$cols 做比较</span><br><span>利用他们的余数来判断是否分行</span><br><br><span><img src='{$picture}' />
<span><a href='{$picture}' target='_blank' />
<br><span>这几个分别是图片的地址 图片的提示 图片的标题</span><br><br><span>{if $descriptionlen}</span><br><span><tr></span><br><span><td>{$picture} <a href='{$picture}' target='_blank'>详细>></a></td></span><br><span></tr></span><br><span>{/if}</span><br><br><span>这一句是，如果允许显示说明，则显示具体的说明信息</span><br><br><br><span>在tag_picturelist.html中，显示的东西则比缩略图模板要多</span><br><span>{$picture} 标题图片</span><br><span>{$picture} 所属栏目</span><br><span><a href="{$picture}" />
<span>{if $showhits}({$picture}){/if} 如果允许显示点击数，则显示点击数</span><br><span>{if $showauthor}[作者:{$picture}]{/if} 显示作者</span><br><span>{if $datetype}[<span>{$picture}</span>]{/if} 显示添加时间</span><br><span>{if $descriptionlen}{$picture}{/if} 显示说明</span><br><br><br><span>图片内容页content.html的制作</span><br><span>打开这个网页</span><br><span><script language=javascript type=text/javascript></span><br><span>function fontZoom(size)</span><br><span>{</span><br><span>document.getElementById('{$addtime}l').style.fontSize=size 'px'</span><br><span>}</span><br><span>var pictureurl=new Array();</span><br><span>var picturename=new Array();</span><br><span>{loop $pictureurls $id $pic}</span><br><span>pictureurl[{$id}] = "{$pic}";</span><br><span>picturename[{$id}] = "{$pic}";</span><br><span>{/loop}</span><br><span></script></span><br><br><span>这个js函数是字体缩放函数</span><br><br><span><!--图片浏览JS开始--></span><br><span><script language=JavaScript></span><br><span><!-- Begin</span><br><span>var rotate_delay =4000; // delay in milliseconds (1000 = 1 secs)</span><br><span>current = 0;</span><br><span>function next() {</span><br><span>if(document.slideform.slide)</span><br><span>{</span><br><span>if(document.all){</span><br><span>document.images.show.style.filter="blendTrans(duration=2)"</span><br><span>< > picture if current</span><br><br><span>document.images.show.style.filter="blendTrans(duration=crossFadeDuration)"</span><br><span>document.images.show.filters.blendTrans.Apply() </span><br><span>}</span><br><span>document.images.show.src = pictureurl;</span><br><span>setidval('picname',picturename);</span><br><span>if(document.all){</span><br><span>document.images.show.filters.blendTrans.play() </span><br><span>}</span><br><span>document.slideform.slide.selectedIndex = current;</span><br><span>}</span><br><span>else</span><br><span>first();</span><br><span>}</span><br><br><span>function previous()</span><br><span>{ </span><br><span>if(current-1 >= 0)</span><br><span>{</span><br><span>if(document.all){</span><br><span>document.images.show.style.filter="blendTrans(duration=2)"</span><br><span>document.images.show.style.filter="blendTrans(duration=crossFadeDuration)"</span><br><span>document.images.show.filters.blendTrans.Apply() </span><br><span>}</span><br><span>document.images.show.src = pictureurl;</span><br><span>setidval('picname',picturename);</span><br><span>if(document.all){</span><br><span>document.images.show.filters.blendTrans.play() </span><br><span>} </span><br><br><span>document.slideform.slide.selectedIndex = --current;</span><br><span>}</span><br><span>else</span><br><span>last();</span><br><br><span>}</span><br><br><span>function first()</span><br><span>{</span><br><span>current = 0;</span><br><span>if(document.all){</span><br><span>document.images.show.style.filter="blendTrans(duration=2)"</span><br><span>document.images.show.style.filter="blendTrans(duration=crossFadeDuration)"</span><br><span>document.images.show.filters.blendTrans.Apply() </span><br><span>}</span><br><span>document.images.show.src = pictureurl;</span><br><span>setidval('picname',picturename);</span><br><span>if(document.all){</span><br><span>document.images.show.filters.blendTrans.play() </span><br><span>} </span><br><span>document.slideform.slide.selectedIndex = 0;</span><br><span>}</span><br><br><span>function last() {</span><br><span>current = document.slideform.slide.length-1;</span><br><span>if(document.all){</span><br><span>document.images.show.style.filter="blendTrans(duration=2)"</span><br><span>document.images.show.style.filter="blendTrans(duration=crossFadeDuration)"</span><br><span>document.images.show.filters.blendTrans.Apply() </span><br><span>}</span><br><span>document.images.show.src = pictureurl;</span><br><span>setidval('picname',picturename);</span><br><span>if(document.all){</span><br><span>document.images.show.filters.blendTrans.play() </span><br><span>} </span><br><span>document.slideform.slide.selectedIndex = current;</span><br><span>}</span><br><br><span>function ap(text) {</span><br><span>document.slideform.slidebutton.value = (text == "Stop") ? "Start" : "Stop";</span><br><span>rotate();</span><br><span>}</span><br><br><span>function change() {</span><br><span>current = document.slideform.slide.selectedIndex;</span><br><span>if(document.all){</span><br><span>document.images.show.style.filter="blendTrans(duration=2)"</span><br><span>document.images.show.style.filter="blendTrans(duration=crossFadeDuration)"</span><br><span>document.images.show.filters.blendTrans.Apply() </span><br><span>}</span><br><span>document.images.show.src = pictureurl;</span><br><span>setidval('picname',picturename);</span><br><span>if(document.all){</span><br><span>document.images.show.filters.blendTrans.play() </span><br><span>} </span><br><span>}</span><br><br><span>function rotate() {</span><br><span>if (document.slideform.slidebutton.value == "Stop") {</span><br><span>current = (current == document.slideform.slide.length-1) ? 0 : current 1;</span><br><span>if(document.all){</span><br><span>document.images.show.style.filter="blendTrans(duration=2)"</span><br><span>< > picture if current</span><br><br><br><span>document.images.show.style.filter="blendTrans(duration=crossFadeDuration)"</span><br><span>document.images.show.filters.blendTrans.Apply() </span><br><span>}</span><br><span>document.images.show.src = pictureurl;</span><br><span>setidval('picname',picturename);</span><br><span>if(document.all){</span><br><span>document.images.show.filters.blendTrans.play() </span><br><span>} </span><br><span>document.slideform.slide.selectedIndex = current;</span><br><span>window.setTimeout("rotate()", rotate_delay);</span><br><span>}</span><br><span>}</span><br><span>function openpic()</span><br><span>{</span><br><span>window.open(pictureurl);</span><br><span>}</span><br><span>// End --></span><br><span></script></span><br><br><span>这个函数是控制js变换的函数</span><br><br><span>CODE: <!--主标题--><div id="title" align="center">{$title}</div></span><br><span><!--文件属性--><div align="center">发布日期：{$adddate}&nbsp;&nbsp;作者：<a href="{PHPCMS_PATH}member/member.php?username={$username}">{$author}</a>&nbsp;&nbsp;来源：<a href="{$copyfromurl}" target="_blank">{$copyfromname}</a>&nbsp;&nbsp;浏览次数：<span id="hits">0</span>&nbsp;&nbsp;<a href="{PHPCMS_PATH}comment/index.php?item=pictureid&itemid={$pictureid}&itemurl={$itemurl}">网友评论<span id="commentnumber1">0</span>条</a>&nbsp;&nbsp;文字大小：【<a href="javascript :fontZoom(16)">大</a>】【<a href="javascript :fontZoom(14)">中</a>】【<a href="javascript :fontZoom(12)">小</a>】 评分等级：{$stars}</div></span><br><span><hr align="center" width="740" size="1" noshade /></span><br><br><br><span><div id="{$addtime}1"><a href="{$itemurl}">来源：{$_PHPCMS['sitename']}({$PHP_SITEURL})<br/>作者：{$username}<br/>原文：{$title}({$itemurl})</a></div></span><br><br><br><br><span><div id="{$addtime}l">{$content}</div></span><br><span>{if $specialid}<div id="{$addtime}l">相关专题：<a href="{$special}">{$special}</a></div>{/if} 这一串和我们以前讲文章页面是一样的，是一些相关的信息</span><br><br><br><span>从<form name=slideform >这个地方开始，就是图片的显示区</span><br><span><span id="picname">{$pictureurls}</span> </span><br><span>图片名称</span><br><span><img src="{$pictureurls}" align="center" name="show" id="picture{$id}" />
<span>图片的具体内容</span><br><span><!--图片名列表--></span><br><span>< > picture if current</span><br><br><br><span><select on change="change();" name="slide"></span><br><span>{loop $pictureurls $id $pic}</span><br><span><option value="{$id}">{$pic}</option></span><br><span>{/loop}</span><br><span></select></span><br><br><span>!--控制按钮--></span><br><span><input />
<span><input />
<span><input />
<span><input />
<span><input name="button" type=button />
<br><span>后面的东西就和文章页面是一样的，都是发布评论的内容</span></span></span></span></span></span></span></span></span></span></p>
頁:
[1]