分享
 
 
 

标签模板及专题模板的制作

王朝网站推广·作者佚名  2011-12-03
窄屏简体版  字體: |||超大  

菠萝教你做模板之三-文章频道的模板制作

上一节我们已经讲过了如何制作首页模板,今天我们说一下如何制作文章频道的模板

请记住,所有phpcms的模板都是三部分 ,掌握了这个要点,我们就可以做出很多个性化的模板,只要你想的到,将标签插入相应的地方就行了!

打开article文件夹,我们会发现有这些模板,

图片附件: Snap1.jpg (2006-7-15 10:07 AM, 103.79 K)

screen.width*0.7) {this.resized=true; this.width=screen.width*0.7; this.alt='点击在新窗口查看全图\nCTRL+鼠标滚轮放大或缩小';}" mousewheel="return imgzoom(this);"

我们会在后台看到这些模板的用途

图片附件: Snap3.jpg (2006-7-15 10:07 AM, 357.5 K)

screen.width*0.7) {this.resized=true; this.width=screen.width*0.7; this.alt='点击在新窗口查看全图\nCTRL+鼠标滚轮放大或缩小';}" mousewheel="return imgzoom(this);"

当我们自己定义了模板之后,可以在后台更新这些模板的说明,所有的说明文件,被记录在templatenames.php这个文件中

1.频道首页的制作

我们用DW打开index.html文件

会发现这样的代码

图片附件: Snap1.jpg (2006-7-15 11:22 AM, 383.58 K)

screen.width*0.7) {this.resized=true; this.width=screen.width*0.7; this.alt='点击在新窗口查看全图\nCTRL+鼠标滚轮放大或缩小';}" mousewheel="return imgzoom(this);"

所有黑色的部分就是标签,绿色的是html代码,蓝色的是超级链接以及样式表的属性。

当我们制作好html模板后,就可以在相应的地方插入标签了

涉及到的标签有

{template 'phpcms','header'}公用头部模板

{template 'phpcms','footer'}公用底部模板

<!--幻灯片标签-->

{$slidepicarticle(0,$channelid,0,1,0,5,30,0,0,5,250,180,5000,-1)}

<!--推荐文章列表-->

{$articlelist(0,$channelid,0,1,0,0,10,50,0,1,0,1,2,1,0,0,1,1)}

<!--最新公告列表-->

{$announcelist(0,$channelid,0,5,30,0,0,1,200,100)}

<!--图片文章-->

{$picarticle(0,$channelid,0,0,0,0,5,22,0,0,0,1,1,1,134,96,5)}

<!--搜索框-->

<script language="Javascript" src="{PHPCMS_PATH}data/js/search.js"></script>

<!--最新专题列表-->

{$speciallist(0,$channelid,0,0,1,28,50,0,0,4,100,100,1)}

<!--投票调查-->

{$voteshow(0,0,$channelid)}

<!--友情链接-->

{$linklist(0,$channelid,1,0,10,2)} 文字链接

{$linklist(0,$channelid,0,0,10,2)} logo链接

<!--自定义栏目开始-->

<table width="100%" cellspacing="0" cellpadding="0">

{loop $childcats $i $cat}

{if $i%2==0}<tr>{/if}

<td valign="top" style="padding:0 5px;">

<table width="100%" cellspacing="0" cellpadding="0">

<tr>

<td class="titlebar" width="100">{$cat[catname]}</td>

<td width="10" height="25"><img src="{$skindir}/images/tit3_r.jpg"></td>

<td width="225" align="right" class="bg_titlebar"><a href="{$cat[caturl]}" class="more">更多</a> </td>

<td width="36"><img src="{$skindir}/images/tit2_r.jpg"></td>

</tr>

</table>

{$articlelist(0,$channelid,$cat[catid],1,0,0,10,30,0,0,0,$cat[ordertype],2,1,0,0,$cat[target],1)}

</td>

{if $i%2==1}</tr>{/if}

{/loop}

</table>

<!--自定义栏目结束-->

这一块是调用当前频道以及子栏目的循环

注意

这一块{if $i%2==0}<tr>{/if}

{if $i%2==1}</tr>{/if}

表示的是分成两列

如果我们要分成三列,这个地方应该改成

{if $i%3==0}<tr>{/if}

{if $i%3==2}</tr>{/if}

{$cat[catname]}

栏目名称

{$articlelist(0,$channelid,$cat[catid],1,0,0,10,30,0,0,0,$cat[ordertype],2,1,0,0,$cat[target],1)}

这一行是该栏目下的文章列表

2.一级栏目category.html的制作

涉及到的js代码

<!--推荐文章js调用-->

<script type="text/javascript" src="{$channelurl}list_js.php?catid={$catid}&iselite=1&articlenum=10&titlelen=28&ordertype=1"></script>

<!--热点文章js调用-->

<script type="text/javascript" src="{$channelurl}list_js.php?catid={$catid}&articlenum=10&titlelen=28&ordertype=5"></script>

<!--搜索框-->

<script language="Javascript" src="{PHPCMS_PATH}data/js/search.js"></script>

涉及到的标签

当前位置:<a href="{$channelurl}">{$channelname}首页</a> >> {$position}

这个{$position}是一个函数,负责取当前的路径,我们可以灵活调用它,不幸的是,中间的风格符是">>"被固定好的,限制了我们的发挥

{loop get_childcat($channelid,$catid) $cat}

·<a href="{$cat[caturl]}" target="{$cat[target]}">{$cat[catname]}</a>

{/loop}

正好也是一个循环,负责取当前目录下面的子栏目

{if $enableadd}

{$picarticle(0,$channelid,$catid,1,0,0,5,10,0,0,0,1,1,1,128,96,5)}

{/if}

这个判断语句的意思是

如果该栏目允许添加文章,那么显示该栏目下最新的5篇图片文章

{loop $arrchildid $i $childcat}

{if $i%2==0}<tr>{/if}

<td width="50%" valign="top" style="padding:0px 5px;">

<table width="100%" cellspacing="0" cellpadding="0">

<tr>

<td class="titlebar" width="100">{$childcat[catname]}</td>

<td width="10" height="25"><img src="{$skindir}/images/tit3_r.jpg"></td>

<td align="right" class="bg_titlebar"><a href="{$childcat[caturl]}" target="{$childcat[target]}" class="more">更多</a> </td>

<td width="36"><img src="{$skindir}/images/tit2_r.jpg"></td>

</tr>

</table>

<!--自定义栏目文章列表-->

{$articlelist(0,$channelid,$childcat[catid],1,0,0,$showchilditems,36,0,0,0,$childcat[itemordertype],2,0,0,0,1,1)}

</td>

{if $i%2==1}</tr>{/if}

{/loop}

这一串也是用来取当前目录下面子目录名称及列表的

我们在前面index的制作中,已经讲过了如何将这个变成3列

3.终极栏目category_list.html的制作

这个页面里面没什么重要的,和上面的差不多

<!--最新图片文章-->{$picarticle(0,$channelid,$catid,1,0,0,5,16,0,0,0,1,1,1,120,90,5)}

<!--栏目文章列表-->

{$articlelist(0,$channelid,$catid,0,0,$page,$maxperpage,60,0,0,0,$itemordertype,1,0,0,0,0,1)}

4.文章页content.html的制作

文章页属于比较重要的页面,因为里面调用到的东西太多了

同时也是最容易出错的页面

<script type=text/javascript>

function fontZoom(size)

{

document.getElementById('{$addtime}l').style.fontSize=size+'px';

}

</script>

字体缩放函数

<!--相关评论js调用-->

<script type="text/javascript" src="{PHPCMS_PATH}comment/list_js.php?item=articleid&itemid={$articleid}&commentnum=10&ordertype=1"></script>

<!--最新文章-->

<script type="text/javascript" src="{$channelurl}list_js.php?catid={$catid}&articlenum=10&titlelen=30&ordertype=1"></script>

<!--推荐文章js调用--><script type="text/javascript" src="{$channelurl}list_js.php?catid={$catid}&iselite=1&articlenum=10&titlelen=30&ordertype=1"></script>

<!--热点文章js调用--><script type="text/javascript" src="{$channelurl}list_js.php?catid={$catid}&articlenum=10&titlelen=30&ordertype=5"></script>

其中的articlenum=10 表示调用10条

titlelen=30表示标题长度为30,也就是15个汉字

<script type=text/javascript>

document.getElementById('{$addtime}1').style.display="none";

document.getElementById('{$addtime}2').style.display="none";

评论函数

function docheck()

{

myform.itemurl.value = window.location;

if(myform.content.value=="") {

alert("请输入评论内容!");

myform.content.focus();

return false;

}

return true;

}

</script>

调用评论次数,浏览次数的js代码

<script type="text/javascript" src="{$channelurl}show_js.php?articleid={$articleid}"></script>

使用到的标签代码

当前位置:<a href="{$channelurl}">{$channelname}首页</a> >> {$position} {$title}

注意{$position}是不能取到文章标题的,所以,需要后面加上{$title}

<!--主标题--><div id="title">{$title} {if $pagenumber>1}({$page}){/if}</div>

<!--副标题-->{if $subheading}<div class="subtitle" align="right">——{$subheading}</div>{/if}

{$adddate} 文章添加时间

{$author} 作者

{$copyfromname} 来源

<span id="hits">0</span>浏览次数

<span id="commentnumber1">0</span>网友评论

【<a href="javascript :fontZoom(16)">大</a>】【<a href="javascript :fontZoom(14)">中</a>】【<a href="javascript :fontZoom(12)">小</a>】文字大小

{$stars} 评分等级

{if $description}<div class="description"><strong>简介:</strong>{$description}</div>{/if} 判断是否有评论

{$_PHPCMS['sitename']}({$PHP_SITEURL}) 来源

{$username} 作者

{$title}({$itemurl}) 原文

{$content} 文章具体内容

$pages} 分页函数

{$checker} 责任编辑

<div class="gray" id="pre_and_next"></div> 分页函数

所有的这些都是可以在后台添加文章的时候看到的。

5.文章频道会员管理文章模板member.html的制作

{$username} 用户名

[{$cha['channelname']} 频道名称

{$cha['itemnumber']} 文章总数

{loop $items $item}

<a href="{$item['itemurl']}" target="_blank">{$item['title']}</a>

{if $item[ontop]}<font color="red">顶</font>{/if}

{if $item[elite]}<font color="blue">荐</font>{/if}

{$item['hits']} 点击次数

{$item['adddate']} 添加时间

{/loop}

{$pages} 分页函数

6.文章频道会员发布文章myitem.html的制作

这个里面没什么将的

所有的函数都是有相应的中文说明的

 
 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
2023年上半年GDP全球前十五强
 百态   2023-10-24
美众议院议长启动对拜登的弹劾调查
 百态   2023-09-13
上海、济南、武汉等多地出现不明坠落物
 探索   2023-09-06
印度或要将国名改为“巴拉特”
 百态   2023-09-06
男子为女友送行,买票不登机被捕
 百态   2023-08-20
手机地震预警功能怎么开?
 干货   2023-08-06
女子4年卖2套房花700多万做美容:不但没变美脸,面部还出现变形
 百态   2023-08-04
住户一楼被水淹 还冲来8头猪
 百态   2023-07-31
女子体内爬出大量瓜子状活虫
 百态   2023-07-25
地球连续35年收到神秘规律性信号,网友:不要回答!
 探索   2023-07-21
全球镓价格本周大涨27%
 探索   2023-07-09
钱都流向了那些不缺钱的人,苦都留给了能吃苦的人
 探索   2023-07-02
倩女手游刀客魅者强控制(强混乱强眩晕强睡眠)和对应控制抗性的关系
 百态   2020-08-20
美国5月9日最新疫情:美国确诊人数突破131万
 百态   2020-05-09
荷兰政府宣布将集体辞职
 干货   2020-04-30
倩女幽魂手游师徒任务情义春秋猜成语答案逍遥观:鹏程万里
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案神机营:射石饮羽
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案昆仑山:拔刀相助
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案天工阁:鬼斧神工
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案丝路古道:单枪匹马
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:与虎谋皮
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:李代桃僵
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:指鹿为马
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案金陵:小鸟依人
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案金陵:千金买邻
 干货   2019-11-12
 
推荐阅读
 
 
 
>>返回首頁<<
 
靜靜地坐在廢墟上,四周的荒凉一望無際,忽然覺得,淒涼也很美
© 2005- 王朝網路 版權所有