F11资源素材网

Discuz X系列单页制作教程

  • 时间:2018-04-15 20:42 编辑:admin 来源: 阅读:178
  • 扫一扫,手机访问
摘要:比较简单,根目录一个PHP文件+模版目录对应的一个HTM文件即可,就不重写了,复制一篇比较详细的过来:一、单页php页面的创建,适用于DIY和普通单页的代码如下:<?phpdefine('CURSCRIPT', 'archy');//body的一个class标

比较简单,根目录一个PHP文件+模版目录对应的一个HTM文件即可,就不重写了,复制一篇比较详细的过来:

一、单页php页面的创建,适用于DIY和普通单页的代码如下:

  1. <?php

  2. define('CURSCRIPT', 'archy');//body的一个class标识

  3. require './source/class/class_core.php';//引入系统核心文件

  4. $discuz = & discuz_core::instance();//以下代码为创建及初始化对象

  5. $discuz->init();

  6. loadcache('diytemplatename');//DIY要载入缓存

  7. $navtitle = '单页的标题';

  8. $metakeywords = '单页关键词1,单页关键词2';

  9. $metadescription = '单页的描述说明';

  10. include template('diy:forum/news');//调用单页模版文件

  11. ?>

单页的php文件存放于论坛根目录。
注意:news为模板文件名,不需要加.htm扩展名,模板文件存放于默认风格目录下的forum目录。找不到当前模版目录位置的可直接放到默认模版目录下,路径为/template/default/forum/


二、单页模板文件news.htm的创建。

1、普通内容单页的模版文件代码:

  1. <!--{template common/header}-->

  2. <div id="pt" class="bm cl">

  3.         <div class="z">

  4.                 <a href="./" class="nvhm" title="{lang homepage}">$_G[setting][bbname]</a><em>»</em>

  5.                 <a href="forum.php">$_G[setting][bbname]</a><em>»</em>

  6.                 <a href="javascript:;">$navtitle</a>

  7.         </div>

  8. </div>

  9. <div id="ct" class="wp cl">

  10.         <div class="mn bm cl">

  11.                 <div class="bm_c">

  12.                 <p style="width:300px; margin:200px auto; text-align:center;">这里是单页正文内容区域</p>                        

  13.                 </div>

  14.         </div>

  15. </div>

  16. <!--{template common/footer}-->

2、可DIY的单页模版文件代码如下:

  1. <!--{template common/header}-->

  2. <div id="pt" class="bm cl">

  3.         <div class="z">

  4.                 <a href="./" class="nvhm" title="{lang homepage}">$_G[setting][bbname]</a><em>»</em>

  5.                 <a href="forum.php">$_G[setting][bbname]</a><em>»</em>

  6.                 <a href="javascript:;">$navtitle</a>

  7.         </div>

  8. </div>


  9. <style id="diy_style" type="text/css"></style>

  10. <div class="wp">

  11. <!--[diy=diy2]--><div id="diy2" class="area"></div><!--[/diy]-->

  12. </div>


  13. <div id="ct" class="wp cl">

  14.         <div class="mn bm cl">

  15.                 <div class="bm_c">

  16.         

  17.                 <p style="width:300px; margin:200px auto; text-align:center;">这里是单页正文内容区域</p>

  18.                         

  19.                 </div>

  20.         </div>

  21. </div>


  22. <!--{template common/footer}-->

3、带有标签选项卡的单页模版:

  1. <!--{subtemplate common/header}-->


  2. <div id="pt" class="bm cl">

  3.         <div class="z">

  4.                 <a href="./" class="nvhm" title="{lang homepage}">$_G[setting][bbname]</a><em>»</em>

  5.                 <a href="forum.php">$_G[setting][bbname]</a><em>»</em>

  6.                 <a href="javascript:;">$navtitle</a>

  7.         </div>

  8. </div>


  9. <div id="ct" class="wp cl ct2">

  10.         <div class="mn bm cl" style="float:right;">

  11.             <div class="bm_h">标题栏</div>

  12.                 <div class="bm_c">

  13.                

  14.             <ul class="tb cl">

  15.                                 <li <!--{if empty($_G[gp_viewtype]) || $_G[gp_viewtype] == 'new'}-->class="a"<!--{/if}-->><a href="news.php?viewtype=new">最新发布</a></li>

  16.                                 <li <!--{if $_G[gp_viewtype] == 'view'}-->class="a"<!--{/if}-->><a href="news.php?viewtype=view">浏览排行</a></li>

  17.                                 <li <!--{if $_G[gp_viewtype] == 'comment'}-->class="a"<!--{/if}-->><a href="news.php?viewtype=comment">回复排行</a></li>

  18.                 <li <!--{if $_G[gp_viewtype] == 'rate'}-->class="a"<!--{/if}-->><a href="news.php?viewtype=rate">评分排行</a></li>

  19.                         </ul>

  20. <div class="archy_con">

  21. <!--{if $_G[gp_viewtype] == 'new'}-->

  22. 这里显示的是new选项卡下的内容

  23. <!--{elseif $_G[gp_viewtype] == 'view'}-->

  24. 这里显示view选项卡下的内容

  25. <!--{elseif $_G[gp_viewtype] == 'comment'}-->

  26. 这里显示comment选项卡下的内容

  27. <!--{/if}-->

  28. </div>

  29.                 </div>

  30.         </div>

  31.    

  32.             <div class="sd" style="float:left;">

  33.    

  34.             <div class="bm">

  35.                         <div class="bm_h">

  36.                                 <h2>公告栏</h2>

  37.                         </div>

  38.                         <div class="bm_c">

  39.                                 <p class="xl xl2 cl" style="line-height:25px;">

  40.                         这里可以放一些公告通知类的文字内容这

  41.                                 </p>

  42.                         </div>

  43.                 </div>

  44.         

  45.         <div class="bm">

  46.                         <div class="bm_h">

  47.                                 <h2>操作菜单</h2>

  48.                         </div>

  49.                         <div class="bm_c">

  50.                                 <ul class="xl xl2 cl">

  51.                         <li><a href="#">测试菜单一</a></li>

  52.                     <li><a href="#">测试菜单二</a></li>

  53.                     <li><a href="#">测试菜单三</a></li>

  54.                     <li><a href="#">测试菜单四</a></li>

  55.                     <li><a href="#">测试菜单五</a></li>

  56.                     <li><a href="#">测试菜单六</a></li>

  57.                                 </ul>

  58.                         </div>

  59.                 </div>


  60.         

  61.         <div class="bm">

  62.                         <div class="bm_h">

  63.                                 <h2>版权信息</h2>

  64.                         </div>

  65.                         <div class="bm_c" style="line-height:25px;">

  66.                                 <ul>

  67.                         <li>作者:<a href="http://www.zhanhelp.com/" target="_blank">站帮网</a></li>

  68.                     <li>网站:<a href="http://www.zhanhelp.com/" target="_blank">站帮网</a></li>

  69.                     <li>版权:站帮网</li>

  70.                                 </ul>

  71.                         </div>

  72.                 </div>

  73.         

  74.     </div>

  75.    

  76. </div>

  77. <!--{subtemplate common/footer}-->

其中

  1. <ul class="tb cl">

  2.                                 <li <!--{if empty($_GET["viewtype"]) || $_GET["viewtype"] == 'new'}-->class="a"<!--{/if}-->><a href="news.php?viewtype=new">最新发布</a></li>

  3.                                 <li <!--{if $_GET["viewtype"] == 'view'}-->class="a"<!--{/if}-->><a href="news.php?viewtype=view">浏览排行</a></li>

  4.                                 <li <!--{if $_GET["viewtype"] == 'comment'}-->class="a"<!--{/if}-->><a href="news.php?viewtype=comment">回复排行</a></li>

  5.                 <li <!--{if $_GET["viewtype"] == 'rate'}-->class="a"<!--{/if}-->><a href="news.php?viewtype=rate">评分排行</a></li>

  6.                         </ul>

解释上面代码,其中每个<li>标签,就是一个选项卡,里面的超链接news.php?viewtype=new,这里的viewtype就是指定一个变量,并且指定值为new,点击这个选项卡时候$_G[gp_viewtype]就会获取到这个值,然后通过判断$_G[gp_viewtype]的值,来选择当前选项卡是否为焦点选项。

建立多页的方法有2种,
一种是建立多个单页,包括多个php文件和多个模板文件,当然这种方法比较直接,但是比较麻烦;第二种就是我们上面说的方法:可以在同一个模板文件中判断$_G[gp_viewtype]的值来选择显示不同的内容,比如在正文区域中如下代码:

  1. <!--{if $_GET["viewtype"] == 'new'}-->

  2. 这里显示的是new选项卡下的内容

  3. <!--{elseif $_GET["viewtype"] == 'view'}-->

  4. 这里显示view选项卡下的内容

  5. <!--{elseif $_GET["viewtype"] == 'comment'}-->

  6. 这里显示comment选项卡下的内容

  7. <!--{/if}-->

这样就实现了一个模版文件中多个页面的效果。点击不同选项卡,显示不同内容。

  • 全部评论(0)
资讯详情页最新发布上方横幅
最新发布的资讯信息
【Discuz!学堂|Discuz!手册】去掉DZ发帖编辑器,单独提取图片及附件上传功能的实现方案 (2018-04-15 20:49)
【Discuz!学堂|】以不同颜色文字化DZ星星数量等级DZ 自定义会员UID开始位数(默认从1开始)(2018-04-15 20:49)
【Discuz!学堂|Discuz!手册】[DZ后台安全] 仅限前台已登录的指定UID访问后台(2018-04-15 20:48)
【Discuz!学堂|Discuz!手册】DZ 不用插件简单实现打赏功能(2018-04-15 20:47)
【Discuz!学堂|Discuz!手册】DZ3.3 tag标签伪静态及开放搜索引擎收录的修改(2018-04-15 20:47)
【Discuz!学堂|Discuz!手册】修改Discuz!X3.2论坛80标题字数的限制(2018-04-15 20:46)
【Discuz!学堂|Discuz!手册】Discuz X3.4 diy主题排序方式增加随机调用帖子(2018-04-15 20:45)
【Discuz!学堂|Discuz!手册】修改DZ触屏版贴内图片过小(默认140px)的方法(2018-04-15 20:45)
【Discuz!学堂|Discuz!手册】DZ 板块FID的判断语句写法(2018-04-15 20:44)
【Discuz!学堂|Discuz!手册】DZ 帖内楼层判断是否是楼主 (2018-04-15 20:44)
网站首页  |   关于我们  |   广告合作  |   联系我们  |   隐私条款  |   免责声明
CopyRight 2014-2024 F11资源素材网 | 皖ICP备17010913号-3
联系客服
平台客服 平台小二 联系客服
手机版

扫一扫进手机版
返回顶部