zoukankan      html  css  js  c++  java
  • discuzx 制作单页面

    简介:这是discuzx 制作单页面的详细页面,介绍了和php,有关的知识、技巧、经验,和一些php源码等。

    class='pingjiaF' frameborder='0' src='http://biancheng.dnbcw.info/pingjia.php?id=336867' scrolling='no'>

    以前7.2版本时候写一个一个单页制作教程,分为带边栏和不带边栏的,很多站长也根据教程学会了自己制作页面。
    其实X版本的单页制作,跟7.2没啥两样,原理都是一样的,只要大家仔细研究的话会发现共同点,只是php里面几行代码稍有不同。

    首先,单页包括该单页的php文件和该单页的模板(.htm)文件,比如:host.php、host.htm

    本帖隐藏的内容

    单页的php文件内容如下:
    1. <?php

    2. require './source/class/class_core.php';//引入系统核心文件
    3. $discuz = & discuz_core::instance();//以下代码为创建及初始化对象
    4. $discuz->cachelist = $cachelist;
    5. $discuz->init();

    6. include template('forum/host');//调用单页模版文件
    7. ?>
    复制代码
    这里需要注意的是,host为模板文件名,不需要加.htm扩展名,模板文件存放于自己当前风格目录下的forum目录;
    单页的php文件存放于论坛根目录;

    php文件创建完毕,现在开始创建模版文件,基本代码如下:
    1. {subtemplate common/header}

    2. <div id="pt" class="wp">
    3. <a href="index.php" class="nvhm">$_G[setting][bbname]</a> &rsaquo; DRC帖子动态
    4. </div>
    5. <style id="diy_style" type="text/css"></style>

    6. <div id="ct" class="wp cl w">

    7. <div class="mn mw">
    8. <div class="content">

    9. 这里是自己正文区域的代码

    10. </div>
    11. </div>
    12. </div>

    13. {subtemplate common/footer}
    复制代码
    其中:
    1. <a href="index.php" class="nvhm">$_G[setting][bbname]</a> &rsaquo; DRC帖子动态
    复制代码
    这一行是单页的路径显示,比如:Discuz! Rescue Centre ? DRC帖子动态,{subtemplate common/header}、{subtemplate common/footer}分别为调用页头、页尾模板,使得单页风格与论坛保持一致;

    至此,基本型单页创建完毕。演示效果见:http://bbs.7drc.com/host.php

    -------------------------------------以下为带右边侧栏单页模板-----------------------------------------

    上面模板文件代码是不带边栏的,现在讲下带边栏的单页模板文件代码,如下:
    1. {subtemplate common/header}
    2. <div id="pt" class="wp"><a href="index.php" class="nvhm">$_G[setting][bbname]</a> &rsaquo; 会员风采</div>
    3. <div id="ct" class="wp cl n">
    4. <div class="mn">
    5. <div class="bm">
    6. <h1 class="mt"><img class="vm" src="static/image/feed/profile.gif" alt="profile"> 分类浏览</h1>
    7. <div class="datalist" style="margin:10px 0;">

    8. 这里是正文区域代码

    9. </div>
    10. </div>
    11. </div>

    12. <!--边栏区域代码开始-->
    13. <div id="psd" class="sd">

    14. <div class="bn">
    15. <p><strong>栏目名称</p>
    16. <p><a href="#">边栏菜单名称</a></p>
    17. <p><a href="#">边栏菜单名称</a></p>
    18. <p><a href="#">边栏菜单名称</a></p>
    19. </div>

    20. <div class="bn">
    21. <p><strong>管理面板</strong></p>
    22. <p><a href="#">添加分类</a></p>
    23. <p><a href="#">管理分类</a></p>
    24. <p><a href="#">返回会员风采</a></p>
    25. </div>

    26. <div class="bn" style="border-bottom:none;">
    27. <p><strong>版权信息</strong></p>
    28. <p>作者:体无完肤</p>
    29. <p>版权:DRC</p>
    30. <p>网站:bbs.7drc.com</p>
    31. </div>

    32. </div>
    33. <!--边栏区域代码结束-->
    34. </div>

    35. {subtemplate common/footer}
    复制代码
    其中:边栏区域代码中,每个<div class="bn">区块为一个边栏菜单区域;
    演示效果见:http://bbs.7drc.com/plugin.php?id=drc_shownow:main

    -------------------------以下为带右边侧栏且多页选项卡切换--------------------------------

    刚看看到论坛有站长问单页中如何做那个多页面选项卡切换,下面介绍下;
    其实就是多了几行代码,都是DX系统自带的,直接使用即可,在上面带右侧边栏模板代码的:
    1. <h1 class="mt"><img class="vm" src="static/image/feed/profile.gif" alt="profile"> 分类浏览</h1>
    复制代码
    这一行下面加入:
    1. <ul class="tb cl">
    2. <li <!--{if empty($_G[gp_viewtype]) || $_G[gp_viewtype] == 'new'}-->class="a"<!--{/if}-->><a href="host.php?viewtype=new">最新发布</a></li>
    3. <li <!--{if $_G[gp_viewtype] == 'view'}-->class="a"<!--{/if}-->><a href="host.php?viewtype=view">浏览排行</a></li>
    4. <li <!--{if $_G[gp_viewtype] == 'comment'}-->class="a"<!--{/if}-->><a href="host.php?viewtype=comment">回复排行</a></li>
    5. <li <!--{if $_G[gp_viewtype] == 'rate'}-->class="a"<!--{/if}-->><a href="host.php?viewtype=rate">评分排行</a></li>
    6. </ul>
    复制代码
    解释上面代码,其中每个<li>标签,就是一个选项卡,里面的超链接host.php?viewtype=new,这里的viewtype就是指定一个变量,并且指定值为new,点击这个选项卡时候$_G[gp_viewtype]就会获取到这个值,然后通过判断$_G[gp_viewtype]的值,来选择当前选项卡是否为焦点选项。

    既然说到多页,那么多个页面如何做,思路可以有两种,一种是建立多个单页,包括多个php文件和多个模板文件,当然这种方法比较直接,但是比较麻烦,可以在同一个模板文件中判断$_G[gp_viewtype]的值来选择显示不同的内容,比如在正文区域中如下代码:
    1. <!--{if $_G[gp_viewtype] == 'new'}-->
    2. 这里显示的是new选项卡下的内容
    3. <!--{elseif $_G[gp_viewtype] == 'view'}-->
    4. 这里显示view选项卡下的内容
    5. <!--{elseif $_G[gp_viewtype] == 'comment'}-->
    6. 这里显示comment选项卡下的内容
    7. <!--{/if}-->
    复制代码
    这样就实现了一个模版文件中多个页面的效果。点击不同选项卡,显示不同内容。

    ------------------------------以下为可以DIY的单页教程--------------------------------

    自己制作的单页中,如何又能使用DX的DIY功能呢?

    只需要稍加改造,即可完成,如下:
    将单页php文件调用模板的那行代码改成:
    1. include template('diy:forum/host');
    复制代码
    这样就可以加载DIY模块,然后在单页模版中,添加DIY区域,如下:
    1. <!--[diy=diy1]--><div id="diy1" class="area"></div><!--[/diy]-->
    复制代码
    这就是一个DIY区域,如果要多个区域,则:
    1. <!--[diy=diy1]--><div id="diy1" class="area"></div><!--[/diy]-->
    2. <!--[diy=diy2]--><div id="diy2" class="area"></div><!--[/diy]-->
    3. <!--[diy=diy3]--><div id="diy3" class="area"></div><!--[/diy]-->
    复制代码
    将里面diy1,diy2,diy3区分开来即可。

    比如,在单页模板代码的<div id="pt" class="wp">这一个div层块的上面或下面加:
    1. <div class="wp">
    2. <!--[diy=diy1]--><div id="diy1" class="area"></div><!--[/diy]-->
    3. </div>
    复制代码
    这样就可以实现单页DIY功能了,需要说明的是,模版中要在什么地方加DIY区域,根据自己需要,并不是固定死的,自己设计在哪,就在哪里加入。



    至此,本教程结束,希望站长们仔细阅读并认真动脑思考、研究,并且制作出自己的单页。

    爱J2EE关注Java迈克尔杰克逊视频站JSON在线工具

    http://biancheng.dnbcw.info/php/336867.html pageNo:9
  • 相关阅读:
    鹰牌陶瓷签约亿客CRM系统 建材行业进入CRM时代
    CRM成为大数据落地的关键
    客户流失了怎么办?
    亿客CRM研发公司简介
    CRM销售管理软件让销售管理成为企业的助力
    CRM帮助企业的营销管理
    浅析移动CRM的客户价值细分
    CRM规划和执行战略
    信息化的先锋CRM
    SaaS的应用将弱化大小企业间竞争差距
  • 原文地址:https://www.cnblogs.com/ooooo/p/2247048.html
Copyright © 2011-2022 走看看