得知互动
标题: Discuz x2.5 单页制作的教程 [打印本页]
作者: inhidgehila 时间: 2015-2-8 16:28
标题: Discuz x2.5 单页制作的教程
马上注册,一起探讨正确快速的建站方法
您需要 登录 才可以下载或查看,没有帐号?快速注册
(, 下载次数: 6)
(, 下载次数: 7)
x
discuz单页的制作其实还是很简单的,之前也有很多版本的单页制作的教程,今天这里主要讲Discuz x2.5 单页的制作,包括单页的DIY,选项卡页面的制作等。
单页包括该单页的php文件和该单页的模板(.htm)文件,比如:news.php、news.htm。查看最新20新帖/回复 X2/X2.5 插件就是使用单页制作的,演示效果:http://bbs.zb7.com/news.php,大家可以下载使用并且体验下。
站帮网发布的关于我们插件也是根据单页的教程制作的,只是结合dz插件机制做成插件了。
下面就开始分析说明单页的代码:
一、单页php页面的创建,适用于DIY和普通单页的代码如下:- <?php
- define('CURSCRIPT', 'archy');//body的一个class标识
- require './source/class/class_core.php';//引入系统核心文件
- $discuz = & discuz_core::instance();//以下代码为创建及初始化对象
- $discuz->init();
- loadcache('diytemplatename');//DIY要载入缓存
- $navtitle = '单页的标题';
- $metakeywords = '单页关键词1,单页关键词2';
- $metadescription = '单页的描述说明';
- include template('diy:forum/news');//调用单页模版文件
- ?>
复制代码单页的php文件存放于论坛根目录。
注意:news为模板文件名,不需要加.htm扩展名,模板文件存放于默认风格目录下的forum目录。此处如果不理解可以看看Discuz!模板解析语法。
二、单页模板文件news.htm的创建。
1、普通内容单页的模版文件代码:- <!--{template common/header}-->
- <div id="pt" class="bm cl">
- <div class="z">
- <a href="./" class="nvhm" title="{lang homepage}">$_G[setting][bbname]</a><em>»</em>
- <a href="forum.php">$_G[setting][bbname]</a><em>»</em>
- <a href="javascript:;">$navtitle</a>
- </div>
- </div>
- <div id="ct" class="wp cl">
- <div class="mn bm cl">
- <div class="bm_c">
- <p style="width:300px; margin:200px auto; text-align:center;">这里是单页正文内容区域</p>
- </div>
- </div>
- </div>
- <!--{template common/footer}-->
复制代码2、可DIY的单页模版文件代码如下:- <!--{template common/header}-->
- <div id="pt" class="bm cl">
- <div class="z">
- <a href="./" class="nvhm" title="{lang homepage}">$_G[setting][bbname]</a><em>»</em>
- <a href="forum.php">$_G[setting][bbname]</a><em>»</em>
- <a href="javascript:;">$navtitle</a>
- </div>
- </div>
- <style id="diy_style" type="text/css"></style>
- <div class="wp">
- <!--[diy=diy2]--><div id="diy2" class="area"></div><!--[/diy]-->
- </div>
- <div id="ct" class="wp cl">
- <div class="mn bm cl">
- <div class="bm_c">
-
- <p style="width:300px; margin:200px auto; text-align:center;">这里是单页正文内容区域</p>
-
- </div>
- </div>
- </div>
- <!--{template common/footer}-->
复制代码其中- <div class="wp">
- <!--[diy=diy2]--><div id="diy2" class="area"></div><!--[/diy]-->
- </div>
复制代码这段代码就是DIY区域的代码,你也可以通过DIV布局,然后加入多个DIY区域。
注意:如果一个页面要插入多个DIY区域,注意修改上面DIY区域的编号ID,几个DIY区域的ID编号不能相同。
3、带有右侧边栏的单页模版文件代码:- <!--{subtemplate common/header}-->
- <div id="pt" class="bm cl">
- <div class="z">
- <a href="./" class="nvhm" title="{lang homepage}">$_G[setting][bbname]</a><em>»</em>
- <a href="forum.php">$_G[setting][bbname]</a><em>»</em>
- <a href="javascript:;">$navtitle</a>
- </div>
- </div>
- <div id="ct" class="wp cl ct2">
- <div class="mn bm cl">
- <div class="bm_h">标题栏</div>
- <div class="bm_c">
-
- <p style="width:300px; margin:220px auto; text-align:center;">这里是单页正文内容区域</p>
-
- </div>
- </div>
-
- <div class="sd">
-
- <div class="bm">
- <div class="bm_h">
- <h2>公告栏</h2>
- </div>
- <div class="bm_c">
- <p class="xl xl2 cl" style="line-height:25px;">
- 这里可以放一些公告通知类的文字内容
- </p>
- </div>
- </div>
-
- <div class="bm">
- <div class="bm_h">
- <h2>操作菜单</h2>
- </div>
- <div class="bm_c">
- <ul class="xl xl2 cl">
- <li><a href="#">测试菜单一</a></li>
- <li><a href="#">测试菜单二</a></li>
- <li><a href="#">测试菜单三</a></li>
- <li><a href="#">测试菜单四</a></li>
- <li><a href="#">测试菜单五</a></li>
- <li><a href="#">测试菜单六</a></li>
- </ul>
- </div>
- </div>
-
- <div class="bm">
- <div class="bm_h">
- <h2>版权信息</h2>
- </div>
- <div class="bm_c" style="line-height:25px;">
- <ul>
- <li>作者:<a href="http://bbs.zb7.com/" target="_blank">ARCHY</a></li>
- <li>网站:<a href="http://bbs.zb7.com/" target="_blank">站帮网</a></li>
- <li>版权:站帮网</li>
- </ul>
- </div>
- </div>
-
- </div>
-
- </div>
- <!--{subtemplate common/footer}-->
复制代码4、带有标签选项卡的单页模版:
游客,如果您要查看本帖隐藏内容请回复
其中- <ul class="tb cl">
- <li <!--{if empty($_GET["viewtype"]) || $_GET["viewtype"] == 'new'}-->class="a"<!--{/if}-->><a href="news.php?viewtype=new">最新发布</a></li>
- <li <!--{if $_GET["viewtype"] == 'view'}-->class="a"<!--{/if}-->><a href="news.php?viewtype=view">浏览排行</a></li>
- <li <!--{if $_GET["viewtype"] == 'comment'}-->class="a"<!--{/if}-->><a href="news.php?viewtype=comment">回复排行</a></li>
- <li <!--{if $_GET["viewtype"] == 'rate'}-->class="a"<!--{/if}-->><a href="news.php?viewtype=rate">评分排行</a></li>
- </ul>
复制代码解释上面代码,其中每个<li>标签,就是一个选项卡,里面的超链接news.php?viewtype=new,这里的viewtype就是指定一个变量,并且指定值为new,点击这个选项卡时候$_G[gp_viewtype]就会获取到这个值,然后通过判断$_G[gp_viewtype]的值,来选择当前选项卡是否为焦点选项。
建立多页的方法有2种,一种是建立多个单页,包括多个php文件和多个模板文件,当然这种方法比较直接,但是比较麻烦;第二种就是我们上面说的方法:可以在同一个模板文件中判断$_G[gp_viewtype]的值来选择显示不同的内容,比如在正文区域中如下代码:- <!--{if $_GET["viewtype"] == 'new'}-->
- 这里显示的是new选项卡下的内容
- <!--{elseif $_GET["viewtype"] == 'view'}-->
- 这里显示view选项卡下的内容
- <!--{elseif $_GET["viewtype"] == 'comment'}-->
- 这里显示comment选项卡下的内容
- <!--{/if}-->
复制代码这样就实现了一个模版文件中多个页面的效果。点击不同选项卡,显示不同内容。
如果你喜欢做模版,可以看看:Discuz模板的制作方法;
如果你还不会安装模板,可以看看:Discuz模板的安装方法。
作者: 匿名 时间: 2015-3-24 09:50
感觉这个论坛的站长太牛B了,好强大啊
作者: 匿名 时间: 2015-3-24 10:05
系统居然怀疑我灌水,我身边又没有水龙头。哦…明白了,身上有一个……
作者: 匿名 时间: 2015-3-24 10:07
我是来收集资料滴...
作者: 匿名 时间: 2015-3-24 10:11
@,@..是什么意思呀?
作者: 匿名 时间: 2015-3-24 10:16
我去看看 网络上的事 我不是很会 哎
作者: swmozowtfl 时间: 2015-7-15 10:51
晚安 别让小嫁再郁闷了 -
作者: kwjvtwzx 时间: 2015-7-15 10:59
朕在自己的寝宫~~~~
作者: efiew 时间: 2015-7-15 11:05
兄弟....表给偶丢丢哦....
作者: kwjvtwzx 时间: 2015-7-15 11:09
风沙就是由无数松散沙粒组成的,但是他们却又紧密的联系在一起,那股叱诧风云,横击 而过的气概相信大家在作者的文章里也能体会的出来。如果有读者还不能体会的,请参考
作者: xiaoye 时间: 2015-7-15 11:14
女人啊真是那句话~~~无理占三分~~忘记怎么说了 呵呵 ~~你帮我想想
欢迎光临 得知互动 (https://bbs.dezhifl.com/) |
Powered by Discuz! X3.4 |