`
lin3qun
  • 浏览: 8121 次
  • 性别: Icon_minigender_1
  • 来自: 武汉
社区版块
存档分类
最新评论

discuzx 制作单页面

阅读更多

以前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.                      这里是自己正文区域的代码
  11.                         
  12.                 </div>
  13.         </div>
  14. </div>

  15. {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.                                这里是正文区域代码
  10.                                 
  11.                         </div>
  12.                 </div>
  13.         </div>

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

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

  22.         <div class="bn">
  23.                 <p><strong>管理面板</strong></p>
  24.                 <p><a href="#">添加分类</a></p>
  25.                 <p><a href="#">管理分类</a></p>
  26.                 <p><a href="#">返回会员风采</a></p>
  27.         </div>
  28.                 
  29.         <div class="bn" style="border-bottom:none;">
  30.                 <p><strong>版权信息</strong></p>
  31.                 <p>作者:体无完肤</p>
  32.                 <p>版权:DRC</p>
  33.                 <p>网站:bbs.7drc.com</p>
  34.         </div>

  35.         </div>
  36.         <!--边栏区域代码结束-->
  37. </div>

  38. {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区域,根据自己需要,并不是固定死的,自己设计在哪,就在哪里加入。



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

分享到:
评论

相关推荐

    discuzx插件制作教程

    X 插件制作教程是一份详细的指南,旨在帮助开发者入门并亲手创建Discuz!X论坛的插件。Discuz!X 是一个流行的开源社区论坛软件,它允许用户通过插件进行功能扩展和定制。 首先,了解Discuz!X中的基本数据结构至关...

    DiscuzX3.2DiscuzX1.5酷播视频插件v3.5

    DiscuzX3.2酷播视频插件 / DiscuzX1.5视频插件支持多终端跨平台观看。 1. 添加极酷阳光V3.5免费版跨平台播放器到dz论坛程序中的视频应用插件 2. 实现视频预览功能(未登录用户只能看一小段,PC端) / 支持手机观看 3. ...

    手把手教你discuzx3.0插件制作教程(可以看)

    《手把手教你discuzX3.0插件制作教程》是一个详尽的指南,旨在帮助初学者和有经验的开发者掌握在discuzX3.0平台上创建插件的全过程。这个教程涵盖了从基础到高级的各种技能,通过实例教学,使学习者能够熟练地开发...

    DiscuzX2页面嵌入模块开发.pdf

    在这个文档中,主要讨论的是在DiscuzX2中如何进行页面嵌入模块的开发,这涉及到对插件系统的理解和使用。 首先,页面嵌入模块开发的核心是通过定义特定的类和函数来实现。这些类和函数的调用基于DiscuzX2的钩子...

    discuzx25_rus

    在"discuzx25_rus"中,开发者针对俄罗斯用户的网络环境进行了性能优化,如缓存技术的运用,减少服务器负载,提升页面加载速度,使得大型论坛也能流畅运行。 五、维护与升级 Discuz! 社区有着庞大的开发者和用户...

    DiscuzX2页面嵌入模块开发文.pdf

    DiscuzX2是一款知名的论坛系统,其页面嵌入模块开发主要涉及到如何在论坛的各个页面中插入自定义的代码或功能。这篇文档详细讲解了如何创建和使用这些嵌入点,以便开发者能灵活地扩展和定制论坛的功能。 首先,我们...

    DiscuzX2.5舞曲系统

    通过这个二次开发的系统,用户不仅可以发布和下载舞曲,还能参与讨论、创建舞曲播放列表、参加活动,甚至可能有舞曲制作教程和DJ技巧分享。七禧团队的努力使得这个社区更加专业和活跃,为舞曲爱好者提供了一个全方位...

    PHP整合dedecms+ucenter+discuzX,实现单点登录.zip

    "PHP整合dedecms+ucenter+discuzX,实现单点登录"是一个针对这个问题的解决方案,它通过集成这三个流行的开源系统——织梦CMS(Dedecms)、uCenter和DiscuzX,让用户的登录状态在各个系统间同步,提高了用户体验和...

    关于我们插件 discuzX2可用哦

    【标题】"关于我们插件 discuzX2可用哦"揭示了这个资源是一个适用于Discuz! X2论坛系统的插件,其主要功能是提供一个“关于我们”页面,展示论坛或者网站的相关信息,帮助访客了解网站的背景、理念、团队等。 ...

    ComsenzDiscuz-DiscuzX-master

    标题中的"ComsenzDiscuz-DiscuzX-master"指的是Discuz! X的源代码仓库主分支,通常在GitHub等代码托管平台上可以找到,它代表了该软件的最新稳定版本或开发版本。 Discuz! X的源代码结构通常包括以下几个关键部分...

    discuzx2.5数据字典

    - url:菜单链接地址,变量长度字符串,指向后台功能的具体页面。 - sort:菜单排序,小型整型,用于决定后台菜单显示的顺序。 - displayorder:显示顺序,小型整型,控制菜单在界面中的排列顺序。 - clicks:...

    DiscuzX建站源代码

    这个压缩包文件包含的就是DiscuzX的源代码,允许用户根据自身需求进行定制和扩展。 DiscuzX的核心功能包括: 1. **用户注册与管理**:提供用户注册、登录、找回密码等功能,支持多级权限设置,可对用户组进行分类和...

    Discuz-DiscuzX-master.zip

    4. **在线安装**:访问服务器上的安装页面,按照提示输入数据库信息,完成基础设置。 5. **初始化数据**:安装完成后,首次登录后台进行论坛的基本设置,如板块、管理员账号等。 三、管理与维护 1. **后台管理**:...

    Discuzx3.4 模板宽屏设计素材教程资源下载

    2.系统版本支持:Discuzx3.0,discuzx3.1,discuzx3.2,discuzx3.3,discuzx3.4;3.门户DIY采用模块化设置,用户可自由布局排版;4.全局美化,对登陆注册、... 1.模板宽度为1180px宽屏设计;2.系统版本支持:Discuzx3.0...

    discuzX2.5版本黑色模板风格下载

    X2.5的模板设计包括了页面布局、颜色搭配、字体选择以及各种模块的样式设置。用户在下载并安装这套模板后,可以将原有的默认界面替换为黑色风格,提升论坛的整体形象,吸引更多用户访问和参与讨论。 下载黑色模板...

    DiscuzX3.2/DiscuzX1.5酷播视频插件(添加自定义视频播放器)

    DiscuzX3.2/DiscuzX1.5酷播视频插件(添加自定义视频播放器) 1. 支持DiscuzX3.2/DiscuzX1.5; 2. 是以自己定义的视频插件形式直接添加到dz论坛的编码中,非常方便论坛用户使用; 3. 本实例已实现跨平台播放,支持PC...

    DiscuzX2.0音乐网站.

    此外,音乐论坛部分可以设立各种板块,如音乐欣赏、音乐制作、乐理讨论等,鼓励用户分享音乐心得,进行技术交流。活动板块可以组织线上音乐活动,如音乐问答、歌曲创作比赛等,增加社区的活跃度和凝聚力。 标签...

    discuzX3.0高仿得意门户模板 v1.0

    FTP上传到根目录,然后后台界面风格安装模板,如果提示不能安装,请阅读下面内容! discuz 社区在更新到2.0以上后,增加了对插件的版本检测,在安装时,可能会出现:“对不起,您安装的不是正版应用,安装程序无法...

Global site tag (gtag.js) - Google Analytics