插件作者的标准出来了!Manyou诚邀开发者加盟!
“互联网平台开发者”特刊 有奖征集开发者
立即免费下载 Discuz!6.1.0正式版
Discuz! 6.1.0 使用说明
Discuz!NT2.5正式版发布
开放源码下载
UCenter Home 1.2 正式版发布
官方站 | 帮助文档
基于ECShop的网店托管-卖否
PHP就业培训直通车 | LAMP培训大连
Discuz!收费服务内容及价格
“感谢有你同行”手握手2008年数万元重奖志愿者
Discuz!/ECShop 专用官方虚拟主机
亿声传媒(Insenz)中秋祝福发送中
Comsenz 招聘信息
网店系统ECShop v2.6.0正式版火热发布
基于Discuz!的免费论坛空间5D6D
参与有奖社区调查 赢取台湾5日游
发新话题
打印

[教程] X-Space应用技巧(二):统一风格后的代码优化

本主题由 茄子 于 2007-9-29 09:19 提升

X-Space应用技巧(二):统一风格后的代码优化

转载于:http://my.donews.com/discuz/2006/07/12/x-space-dev-002/
在上一篇介绍了X-Space如何与论坛保持统一风格的修改方法,文中只给出了修改X-Space首页的示例代码,其他页面的修改是这样描述的:
要修改头部和左边的风格,只需要改动对应的header模板即可,而对应的右边和底部的风格,则在footer模板里修改。对于有必要的css修改,则只需要修改对应css文件即可。
这样的操作从理论说是没有错的。但是每一个类别都作这样修改的话(有日志、咨询、相册等模块),工作量是非常大的,并且当模板有了改动,必须针对美观修改过的页面都做相应的调整,这样操作既繁重又笨拙。
从修改中我们可以看到,在header和footer中修改的内容其实是一样的,这样我们就可以将这些内容提取到一个文件中,然后由其他header模板和footer模板来引用之,就可以减轻大量的工作,且可以保证风格变换时不至于对每个页面一一做修改的烦琐。
下面来看具体操作步骤:
第一步:提取header.html.php中的代码:

  • 将上文中的附件中的代码1从wwwroot/supesite/templates/default/header.html.php中提取出来;
  • 新建一个文件wwwroot/supesite/templates/default/demo_style_header.html.php,将代码1保存其中;
  • 在header.html.php文件中代码1处添加{template demo_style_header},添加后的代码大致如下:

</head>
<body>
{template demo_style_header}
<div class=”wrap”>
<div id=”header”>
第二步:提取footer.html.php中的代码:

  • 将上文中的附件中的代码2从wwwroot/supesite/templates/default/footer.html.php中提取出来;
  • 新建一个文件wwwroot/supesite/templates/default/demo_style_footer.html.php,将代码2保存其中;
  • 在footer.html.php文件中代码2处添加{template demo_style_footer},保存。

OK,对首页的优化已经完毕。
其他模块的页面,只需要在相应的header.html.php和footer.html.php中加入{template demo_style_header}{template demo_style_footer} 即可,就不必每个模块的头模板和尾模板页面中添加代码1代码2了。
优化后的方案有很多好处:

  • 当不需要自定义模板而还原默认模板时,只需要将demo_style_header.html.php和demo_style_footer.html.php中的内容置空即可;
  • 同样的,修改模板风格时,只需要修改demo_style_header.html.php和demo_style_footer.html.php的内容;
  • 保证了模板文件的统一,不至于个别模板出错而导致整体风格不统一。
又有沙发做了,支持
不错呀
支持!
不错
555
收一个。。。
楼主,真不错。对照着慢慢来做。
本来X-Space设计时就应该考虑如此,便于应用啊
欢迎 光临 漳平博客  !想转换成SS,正在愁眉不展中%……#·¥%—*
首页  
技术贴。

支持!
可以
发新话题
版块跳转