查看: 383|回复: 9

单页制作教程 For Discuz!X2(DIY/左右边栏/标签选项卡)

[复制链接]

156

主题

357

回帖

626

积分

高级会员

积分
626
发表于 2023-4-29 08:54:02 | 显示全部楼层 |阅读模式

马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。

您需要 登录 才可以下载或查看,没有账号?立即注册

x
作者:体无完肤
首先,单页包括该单页的php文件和该单页的模板(.htm)文件,比如:host.php、host.htm

普通单页的php文件内容如下:
  1. init();$navtitle = '官方QQ群列表';$metakeywords = 'QQ群,官方,discuz,DRC,7drc,QQ';$metadescription = '该页面展示Discuz! Rescue Centre 官方QQ群系,加入本站官方QQ群可及时了解掌握最新动态、插件、模版第一手信息。请勿加入多个QQ群,珍惜有限的群资源。';include template('forum/host');//调用单页模版文件?>
复制代码
这里需要注意的是,host为模板文件名,不需要加.htm扩展名,模板文件存放于默认风格目录下的forum目录;
单页的php文件存放于论坛根目录;

$navtitle = '官方QQ群列表'; 这一句是定义单页的标题,显示于浏览器顶部的网页标题
$metakeywords = 'QQ群,官方,discuz,DRC,7drc,QQ'; 是单页的关键词信息
$metadescription 是单页的描述信息。

可DIY的单页PHP文件代码内容如下:
  1. init();loadcache('diytemplatename');$navtitle = '官方QQ群列表';$metakeywords = 'QQ群,官方,discuz,DRC,7drc,QQ';$metadescription = '该页面展示Discuz! Rescue Centre 官方QQ群系,加入本站官方QQ群可及时了解掌握最新动态、插件、模版第一手信息。请勿加入多个QQ群,珍惜有限的群资源。';include template('diy:forum/host');//调用单页模版文件?>
复制代码
注:其中 loadcache('diytemplatename'); 为Discuz!X2对DIY这一块做的更新,DIY要载入缓存,所以以前X1.5的单页制作教程做出来的单页DIY会无法保存。DIY的单页模版文件,修改单页模版内容后需要更新缓存才能刷新出来。


php文件创建完毕,现在开始创建模版文件,基本代码如下:


普通单页的模版文件代码:
  1.    
            $_G[setting][bbname]»        $_G[setting][bbname]»        $navtitle   
       
            
                

    这里是单页正文内容区域

                        
       
复制代码
效果如下:

d1.jpg

-------------------------------------------------------------------------------------

可DIY的单页模版文件代码如下:
  1.    
            $_G[setting][bbname]»        $_G[setting][bbname]»        $navtitle   
       
            
                        

    这里是单页正文内容区域

                        
       
复制代码
其中:
复制代码
这段代码就是DIY区域的代码,之前X1.5的单页教程里面我们也讲到过,可以在单页的任意位置插入DIY区域,即:
复制代码
注意:如果一个页面要插入多个DIY区域,注意修改上面DIY区域的编号ID,几个DIY区域的ID编号不能相同。
-------------------------------------------------------------------------------------

带有右侧边栏的单页模版文件代码:
  1.    
            $_G[setting][bbname]»        $_G[setting][bbname]»        $navtitle   
       
            
    标题栏
            
                           

    这里是单页正文内容区域

                        
       
                
                
                
                   

    公告栏

                
                
                   

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

                
            
                   
                
                   

    操作菜单

                
                
                                
            
                   
                
                   

    版权信息

                
                
                   
                          
    • 作者:体无完肤
    •                     
    • 网站:bbs.7drc.com
    •                     
    • 版权:Discuz! Rescue Centre
    •                
                
            
                
       
复制代码
效果如下:
d2.jpg



-------------------------------------------------------------------------------------

带有左侧边栏的单页模版文件代码:
  1.    
            $_G[setting][bbname]»        $_G[setting][bbname]»        $navtitle   
       
            
    标题栏
            
                           

    这里是单页正文内容区域

                        
       
                
                
                
                   

    公告栏

                
                
                   

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

                
            
                   
                
                   

    操作菜单

                
                
                                
            
                   
                
                   

    版权信息

                
                
                   
                          
    • 作者:体无完肤
    •                     
    • 网站:bbs.7drc.com
    •                     
    • 版权:Discuz! Rescue Centre
    •                
                
            
                
       
复制代码
注意观察这个左侧边栏的模版代码和右侧边栏的模版代码,可以发现,代码其实都一样,只是更改一下CSS样式。

给这个div加一个向右浮动,即:
复制代码
再给
这个div加一个向左浮动的CSS样式,即:
复制代码
就是说只是左右对调一下。

演示效果如下:

d3.jpg

-------------------------------------------------------------------------------------


带有标签选项卡的单页模版:
  1.    
            $_G[setting][bbname]»        $_G[setting][bbname]»        $navtitle   
       
            
    标题栏
            
                            
                                      
    • class="a">最新发布
    •                                 
    • class="a">浏览排行
    •                                 
    • class="a">回复排行
    •                
    • class="a">评分排行
    •                         
                           

    这里是单页正文内容区域

                        
       
                
                
                
                   

    公告栏

                
                
                   

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

                
            
                   
                
                   

    操作菜单

                
                
                                
            
                   
                
                   

    版权信息

                
                
                   
                          
    • 作者:体无完肤
    •                     
    • 网站:bbs.7drc.com
    •                     
    • 版权:Discuz! Rescue Centre
    •                
                
            
                
       
复制代码
注意观察你会发现,选项卡这一部分跟X1.5一样的,就是在模版的正文区域的div内增加一段代码:
    •                                 
    • class="a">最新发布
    •                                 
    • class="a">浏览排行
    •                                 
    • class="a">回复排行
    •                
    • class="a">评分排行
    •                         
复制代码
效果如下:

d4.jpg

此次教程整理结束。

免责声明

1.本网站所收集的部分公开资料来源于互联网,转载的目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。
2.如果您发现网站上有侵犯您的知识产权的作品,请与我们取得联系,我们会及时修改或删除。

上一篇:X3.5新增的独立模式 头像指向uc_server 请问怎么解决
下一篇:3.5版的默认手机模板在关闭论坛的情况下如何去掉显示论坛

回复

使用道具 举报

170

主题

381

回帖

666

积分

高级会员

积分
666
发表于 2023-4-29 08:54:36 | 显示全部楼层
学习学习
回复 支持 反对

使用道具 举报

156

主题

357

回帖

626

积分

高级会员

积分
626
楼主 发表于 2023-4-29 08:55:22 | 显示全部楼层
学习学习{:2_27:}
回复 支持 反对

使用道具 举报

114

主题

372

回帖

559

积分

高级会员

积分
559
发表于 2023-4-29 08:55:45 | 显示全部楼层
include template('forum/host');//调用单页模版文件
如果调用的模板里面有加载其他数据,直接调用单页模板不显示页面的数据,这个应该怎么加呢
回复 支持 反对

使用道具 举报

159

主题

389

回帖

665

积分

高级会员

积分
665
发表于 2023-4-29 08:56:00 | 显示全部楼层
不知道你说什么
回复 支持 反对

使用道具 举报

3991

主题

353

回帖

4481

积分

论坛元老

积分
4481
发表于 2023-4-29 08:56:58 | 显示全部楼层
厉害厉害,dz我还是只摸到皮毛,向大佬学习
回复 支持 反对

使用道具 举报

153

主题

356

回帖

610

积分

高级会员

积分
610
发表于 2023-4-29 08:57:11 | 显示全部楼层
感谢分享!
回复 支持 反对

使用道具 举报

153

主题

356

回帖

610

积分

高级会员

积分
610
发表于 2023-4-29 08:57:28 | 显示全部楼层
模板不错
回复 支持 反对

使用道具 举报

161

主题

364

回帖

620

积分

高级会员

积分
620
发表于 2023-4-29 08:57:59 | 显示全部楼层
666666666666666666666
回复 支持 反对

使用道具 举报

156

主题

357

回帖

626

积分

高级会员

积分
626
楼主 发表于 2023-4-29 08:58:58 | 显示全部楼层
这个很牛啊。学习一下
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

快速回复 返回顶部 返回列表