久久久久av_欧美日韩一区二区在线_国产精品三区四区_日韩中字在线

Discuz! 官方交流社區

標題: 單頁制作教程 For Discuz!X2(DIY/左右邊欄/標簽選項卡) [打印本頁]

作者: dashen    時間: 2021-12-15 13:08
標題: 單頁制作教程 For Discuz!X2(DIY/左右邊欄/標簽選項卡)
作者:體無完膚
首先,單頁包括該單頁的php文件和該單頁的模板(.htm)文件,比如:host.php、host.htm

普通單頁的php文件內容如下:
  1. <?php
  2. define('CURSCRIPT', 'test');
  3. require './source/class/class_core.php';//引入系統核心文件
  4. $discuz = & discuz_core::instance();//以下代碼為創建及初始化對象
  5. $discuz->init();
  6. $navtitle = '官方QQ群列表';
  7. $metakeywords = 'QQ群,官方,discuz,DRC,7drc,QQ';
  8. $metadescription = '該頁面展示Discuz! Rescue Centre 官方QQ群系,加入本站官方QQ群可及時了解掌握最新動態、插件、模版第一手信息。請勿加入多個QQ群,珍惜有限的群資源。';
  9. include template('forum/host');//調用單頁模版文件
  10. ?>
復制代碼
這里需要注意的是,host為模板文件名,不需要加.htm擴展名,模板文件存放于默認風格目錄下的forum目錄;
單頁的php文件存放于論壇根目錄;

$navtitle = '官方QQ群列表'; 這一句是定義單頁的標題,顯示于瀏覽器頂部的網頁標題
$metakeywords = 'QQ群,官方,discuz,DRC,7drc,QQ'; 是單頁的關鍵詞信息
$metadescription 是單頁的描述信息。

可DIY的單頁PHP文件代碼內容如下:
  1. <?php
  2. define('CURSCRIPT', 'test');
  3. require './source/class/class_core.php';//引入系統核心文件
  4. $discuz = & discuz_core::instance();//以下代碼為創建及初始化對象
  5. $discuz->init();
  6. loadcache('diytemplatename');
  7. $navtitle = '官方QQ群列表';
  8. $metakeywords = 'QQ群,官方,discuz,DRC,7drc,QQ';
  9. $metadescription = '該頁面展示Discuz! Rescue Centre 官方QQ群系,加入本站官方QQ群可及時了解掌握最新動態、插件、模版第一手信息。請勿加入多個QQ群,珍惜有限的群資源。';
  10. include template('diy:forum/host');//調用單頁模版文件
  11. ?>
復制代碼
注:其中 loadcache('diytemplatename'); 為Discuz!X2對DIY這一塊做的更新,DIY要載入緩存,所以以前X1.5的單頁制作教程做出來的單頁DIY會無法保存。DIY的單頁模版文件,修改單頁模版內容后需要更新緩存才能刷新出來。


php文件創建完畢,現在開始創建模版文件,基本代碼如下:


普通單頁的模版文件代碼:
  1. <!--{template common/header}-->
  2. <style id="diy_style" type="text/css"></style>
  3. <div id="pt" class="bm cl">
  4.     <div class="z">
  5.         <a href="./" class="nvhm" title="{lang homepage}">$_G[setting][bbname]</a><em>&raquo;</em>
  6.         <a href="forum.php">$_G[setting][bbname]</a><em>&raquo;</em>
  7.         <a href="javascript:;">$navtitle</a>
  8.     </div>
  9. </div>
  10. <div id="ct" class="wp cl">
  11.     <div class="mn bm cl">
  12.         <div class="bm_c">
  13.             <p style="width:300px; margin:200px auto; text-align:center;">這里是單頁正文內容區域</p>            
  14.         </div>
  15.     </div>
  16. </div>
  17. <!--{template common/footer}-->
復制代碼
效果如下:

(, 下載次數: 88)

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

可DIY的單頁模版文件代碼如下:
  1. <!--{template common/header}-->
  2. <style id="diy_style" type="text/css"></style>
  3. <div id="pt" class="bm cl">
  4.     <div class="z">
  5.         <a href="./" class="nvhm" title="{lang homepage}">$_G[setting][bbname]</a><em>&raquo;</em>
  6.         <a href="forum.php">$_G[setting][bbname]</a><em>&raquo;</em>
  7.         <a href="javascript:;">$navtitle</a>
  8.     </div>
  9. </div>

  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}-->
復制代碼
其中:
  1. <div class="wp">
  2. <!--[diy=diy2]--><div id="diy2" class="area"></div><!--[/diy]-->
  3. </div>
復制代碼
這段代碼就是DIY區域的代碼,之前X1.5的單頁教程里面我們也講到過,可以在單頁的任意位置插入DIY區域,即:
  1. <!--[diy=diy2]--><div id="diy2" class="area"></div><!--[/diy]-->
復制代碼
注意:如果一個頁面要插入多個DIY區域,注意修改上面DIY區域的編號ID,幾個DIY區域的ID編號不能相同。
-------------------------------------------------------------------------------------

帶有右側邊欄的單頁模版文件代碼:
  1. <!--{subtemplate common/header}-->
  2. <style id="diy_style" type="text/css"></style>

  3. <div id="pt" class="bm cl">
  4.     <div class="z">
  5.         <a href="./" class="nvhm" title="{lang homepage}">$_G[setting][bbname]</a><em>&raquo;</em>
  6.         <a href="forum.php">$_G[setting][bbname]</a><em>&raquo;</em>
  7.         <a href="javascript:;">$navtitle</a>
  8.     </div>
  9. </div>

  10. <div id="ct" class="wp cl ct2">
  11.     <div class="mn bm cl">
  12.         <div class="bm_h">標題欄</div>
  13.         <div class="bm_c">
  14.             
  15.            <p style="width:300px; margin:220px auto; text-align:center;">這里是單頁正文內容區域</p>
  16.             
  17.         </div>
  18.     </div>
  19.    
  20.         <div class="sd">
  21.    
  22.         <div class="bm">
  23.             <div class="bm_h">
  24.                 <h2>公告欄</h2>
  25.             </div>
  26.             <div class="bm_c">
  27.                 <p class="xl xl2 cl" style="line-height:25px;">
  28.                     這里可以放一些公告通知類的文字內容這里可以放一些公告通知類的文字內容這里可以放一些公告通知類的文字內容這里可以放一些公告通知類的文字內容這里可以放一些公告通知類的文字內容這里可以放一些公告通知類的文字內容
  29.                 </p>
  30.             </div>
  31.         </div>
  32.         
  33.         <div class="bm">
  34.             <div class="bm_h">
  35.                 <h2>操作菜單</h2>
  36.             </div>
  37.             <div class="bm_c">
  38.                 <ul class="xl xl2 cl">
  39.                     <li><a href="#">測試菜單一</a></li>
  40.                     <li><a href="#">測試菜單二</a></li>
  41.                     <li><a href="#">測試菜單三</a></li>
  42.                     <li><a href="#">測試菜單四</a></li>
  43.                     <li><a href="#">測試菜單五</a></li>
  44.                     <li><a href="#">測試菜單六</a></li>
  45.                 </ul>
  46.             </div>
  47.         </div>

  48.         
  49.         <div class="bm">
  50.             <div class="bm_h">
  51.                 <h2>版權信息</h2>
  52.             </div>
  53.             <div class="bm_c" style="line-height:25px;">
  54.                 <ul>
  55.                     <li>作者:<a href="http://www.mutoulee.cn" target="_blank">體無完膚</a></li>
  56.                     <li>網站:<a href="http://bbs.7drc.com" target="_blank">bbs.7drc.com</a></li>
  57.                     <li>版權:Discuz! Rescue Centre</li>
  58.                 </ul>
  59.             </div>
  60.         </div>
  61.         
  62.     </div>
  63.    
  64. </div>

  65. <!--{subtemplate common/footer}-->
復制代碼
效果如下:
(, 下載次數: 71)



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

帶有左側邊欄的單頁模版文件代碼:
  1. <!--{subtemplate common/header}-->
  2. <style id="diy_style" type="text/css"></style>

  3. <div id="pt" class="bm cl">
  4.     <div class="z">
  5.         <a href="./" class="nvhm" title="{lang homepage}">$_G[setting][bbname]</a><em>&raquo;</em>
  6.         <a href="forum.php">$_G[setting][bbname]</a><em>&raquo;</em>
  7.         <a href="javascript:;">$navtitle</a>
  8.     </div>
  9. </div>

  10. <div id="ct" class="wp cl ct2">
  11.     <div class="mn bm cl" style="float:right;">
  12.         <div class="bm_h">標題欄</div>
  13.         <div class="bm_c">
  14.             
  15.            <p style="width:300px; margin:220px auto; text-align:center;">這里是單頁正文內容區域</p>
  16.             
  17.         </div>
  18.     </div>
  19.    
  20.         <div class="sd" style="float:left;">
  21.    
  22.         <div class="bm">
  23.             <div class="bm_h">
  24.                 <h2>公告欄</h2>
  25.             </div>
  26.             <div class="bm_c">
  27.                 <p class="xl xl2 cl" style="line-height:25px;">
  28.                     這里可以放一些公告通知類的文字內容這里可以放一些公告通知類的文字內容這里可以放一些公告通知類的文字內容這里可以放一些公告通知類的文字內容這里可以放一些公告通知類的文字內容這里可以放一些公告通知類的文字內容
  29.                 </p>
  30.             </div>
  31.         </div>
  32.         
  33.         <div class="bm">
  34.             <div class="bm_h">
  35.                 <h2>操作菜單</h2>
  36.             </div>
  37.             <div class="bm_c">
  38.                 <ul class="xl xl2 cl">
  39.                     <li><a href="#">測試菜單一</a></li>
  40.                     <li><a href="#">測試菜單二</a></li>
  41.                     <li><a href="#">測試菜單三</a></li>
  42.                     <li><a href="#">測試菜單四</a></li>
  43.                     <li><a href="#">測試菜單五</a></li>
  44.                     <li><a href="#">測試菜單六</a></li>
  45.                 </ul>
  46.             </div>
  47.         </div>

  48.         
  49.         <div class="bm">
  50.             <div class="bm_h">
  51.                 <h2>版權信息</h2>
  52.             </div>
  53.             <div class="bm_c" style="line-height:25px;">
  54.                 <ul>
  55.                     <li>作者:<a href="http://www.mutoulee.cn" target="_blank">體無完膚</a></li>
  56.                     <li>網站:<a href="http://bbs.7drc.com" target="_blank">bbs.7drc.com</a></li>
  57.                     <li>版權:Discuz! Rescue Centre</li>
  58.                 </ul>
  59.             </div>
  60.         </div>
  61.         
  62.     </div>
  63.    
  64. </div>

  65. <!--{subtemplate common/footer}-->
復制代碼
注意觀察這個左側邊欄的模版代碼和右側邊欄的模版代碼,可以發現,代碼其實都一樣,只是更改一下CSS樣式。

<div class="mn bm cl"> 給這個div加一個向右浮動,即:
  1. <div class="mn bm cl" style="float:right;">
復制代碼
再給 <div class="sd"> 這個div加一個向左浮動的CSS樣式,即:
  1. <div class="sd" style="float:left;">
復制代碼
就是說只是左右對調一下。

演示效果如下:

(, 下載次數: 80)

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


帶有標簽選項卡的單頁模版:
  1. <!--{subtemplate common/header}-->
  2. <style id="diy_style" type="text/css"></style>

  3. <div id="pt" class="bm cl">
  4.     <div class="z">
  5.         <a href="./" class="nvhm" title="{lang homepage}">$_G[setting][bbname]</a><em>&raquo;</em>
  6.         <a href="forum.php">$_G[setting][bbname]</a><em>&raquo;</em>
  7.         <a href="javascript:;">$navtitle</a>
  8.     </div>
  9. </div>

  10. <div id="ct" class="wp cl ct2">
  11.     <div class="mn bm cl" style="float:right;">
  12.         <div class="bm_h">標題欄</div>
  13.         <div class="bm_c">
  14.             
  15.             <ul class="tb cl">
  16.                                 <li <!--{if empty($_G[gp_viewtype]) || $_G[gp_viewtype] == 'new'}-->class="a"<!--{/if}-->><a href="test.php?viewtype=new">最新發布</a></li>
  17.                                 <li <!--{if $_G[gp_viewtype] == 'view'}-->class="a"<!--{/if}-->><a href="test.php?viewtype=view">瀏覽排行</a></li>
  18.                                 <li <!--{if $_G[gp_viewtype] == 'comment'}-->class="a"<!--{/if}-->><a href="test.php?viewtype=comment">回復排行</a></li>
  19.                 <li <!--{if $_G[gp_viewtype] == 'rate'}-->class="a"<!--{/if}-->><a href="test.php?viewtype=rate">評分排行</a></li>
  20.                         </ul>
  21.             
  22.            <p style="width:300px; margin:200px auto; text-align:center;">這里是單頁正文內容區域</p>
  23.             
  24.         </div>
  25.     </div>
  26.    
  27.         <div class="sd" style="float:left;">
  28.    
  29.         <div class="bm">
  30.             <div class="bm_h">
  31.                 <h2>公告欄</h2>
  32.             </div>
  33.             <div class="bm_c">
  34.                 <p class="xl xl2 cl" style="line-height:25px;">
  35.                     這里可以放一些公告通知類的文字內容這里可以放一些公告通知類的文字內容這里可以放一些公告通知類的文字內容這里可以放一些公告通知類的文字內容這里可以放一些公告通知類的文字內容這里可以放一些公告通知類的文字內容
  36.                 </p>
  37.             </div>
  38.         </div>
  39.         
  40.         <div class="bm">
  41.             <div class="bm_h">
  42.                 <h2>操作菜單</h2>
  43.             </div>
  44.             <div class="bm_c">
  45.                 <ul class="xl xl2 cl">
  46.                     <li><a href="#">測試菜單一</a></li>
  47.                     <li><a href="#">測試菜單二</a></li>
  48.                     <li><a href="#">測試菜單三</a></li>
  49.                     <li><a href="#">測試菜單四</a></li>
  50.                     <li><a href="#">測試菜單五</a></li>
  51.                     <li><a href="#">測試菜單六</a></li>
  52.                 </ul>
  53.             </div>
  54.         </div>

  55.         
  56.         <div class="bm">
  57.             <div class="bm_h">
  58.                 <h2>版權信息</h2>
  59.             </div>
  60.             <div class="bm_c" style="line-height:25px;">
  61.                 <ul>
  62.                     <li>作者:<a href="http://www.mutoulee.cn" target="_blank">體無完膚</a></li>
  63.                     <li>網站:<a href="http://bbs.7drc.com" target="_blank">bbs.7drc.com</a></li>
  64.                     <li>版權:Discuz! Rescue Centre</li>
  65.                 </ul>
  66.             </div>
  67.         </div>
  68.         
  69.     </div>
  70.    
  71. </div>

  72. <!--{subtemplate common/footer}-->
復制代碼
注意觀察你會發現,選項卡這一部分跟X1.5一樣的,就是在模版的正文區域的div內增加一段代碼:
  1. <ul class="tb cl">
  2.                                 <li <!--{if empty($_G[gp_viewtype]) || $_G[gp_viewtype] == 'new'}-->class="a"<!--{/if}-->><a href="test.php?viewtype=new">最新發布</a></li>
  3.                                 <li <!--{if $_G[gp_viewtype] == 'view'}-->class="a"<!--{/if}-->><a href="test.php?viewtype=view">瀏覽排行</a></li>
  4.                                 <li <!--{if $_G[gp_viewtype] == 'comment'}-->class="a"<!--{/if}-->><a href="test.php?viewtype=comment">回復排行</a></li>
  5.                 <li <!--{if $_G[gp_viewtype] == 'rate'}-->class="a"<!--{/if}-->><a href="test.php?viewtype=rate">評分排行</a></li>
  6.                         </ul>
復制代碼
效果如下:

(, 下載次數: 90)

此次教程整理結束。


作者: Xianger2120    時間: 2021-12-15 13:31
學習學習
作者: CG小霸王    時間: 2021-12-15 21:12
學習學習
作者: Xianger2120    時間: 2021-12-18 10:00

include template('forum/host');//調用單頁模版文件
如果調用的模板里面有加載其他數據,直接調用單頁模板不顯示頁面的數據,這個應該怎么加呢
作者: dashen    時間: 2021-12-18 13:12
Xianger2120 發表于 2021-12-18 10:00
include template('forum/host');//調用單頁模版文件
如果調用的模板里面有加載其他數據,直接調用單頁模 ...

不知道你說什么
作者: 玩慈利網    時間: 2021-12-20 11:59
厲害厲害,dz我還是只摸到皮毛,向大佬學習
作者: 無名    時間: 2021-12-20 20:26
感謝分享!
作者: ysx24    時間: 2021-12-21 20:00
模板不錯
作者: xiongmao    時間: 2021-12-26 16:25
666666666666666666666
作者: bkevin0829    時間: 2021-12-26 22:03
這個很牛啊。學習一下
作者: 可樂不加冰    時間: 2022-1-17 21:22
學習再學習
作者: Rain木兮    時間: 2022-1-18 09:31
單頁制作教程
作者: pcinstall    時間: 2022-2-14 20:31
kk看看
作者: 金黑網絡    時間: 2022-2-15 02:12
不是傳說中的 體無完膚 老大出的教程吧。
作者: ouhighboy    時間: 2022-3-8 00:10
學習一下
作者: 龍二哥    時間: 2022-6-15 22:16
好東東。
作者: xzi_cc    時間: 2022-6-23 12:29
棒呀?。。?!
作者: 一劍橫天    時間: 2022-9-28 11:17
用這個代碼,死活不顯示插件,因為少了一句代碼【runhooks();】

管理加上吧?免得以后其他用戶糾結死
作者: zhyy7112    時間: 2022-10-5 22:28
感謝樓主的分享
作者: 文強    時間: 2022-10-14 10:55
進來學習一下,感謝分享。
作者: zhansh    時間: 2022-10-17 20:57
好文章啊,學習學習
作者: 影子    時間: 2022-10-25 11:00
這個太好了
作者: dq10000    時間: 2022-10-25 15:00
學習學習
作者: 山有扶蘇    時間: 2022-10-27 11:06
學習了,謝謝分享
作者: icpcn    時間: 2022-12-2 22:24
學習 。
作者: wuhard    時間: 2022-12-6 10:16
不錯的教程
作者: qhminhe    時間: 2022-12-8 21:35
單頁制作教程 For Discuz!X2(DIY/左右邊欄/標簽選項卡)
作者: 任我行    時間: 2022-12-15 20:24
太給力了,大贊
作者: gogo123    時間: 2022-12-17 20:25
制作教程 For Discuz
作者: 幸福班主任    時間: 2023-1-13 10:23
真不愧是大佬啊~~學習了!
作者: 幸福    時間: 2023-1-24 17:13
向大佬學習!
作者: yezirui    時間: 2023-4-28 21:01
感謝分享
作者: liucaihex    時間: 2023-7-5 23:43
嚯嚯嚯,這個主題還在吶。
作者: 9axl    時間: 2023-9-6 18:36
學習中。。。。
作者: 海哥    時間: 2023-9-12 21:23
頂樓主啦..希望樓主多發精品好帖啦.....
作者: 海哥    時間: 2023-10-12 14:04
頂樓主啦..希望樓主多發精品好帖啦.....
作者: playba    時間: 2023-10-17 16:37
這個很牛啊。學習一下

作者: 壓力山大    時間: 2023-11-3 09:37
非常好教材,學習一下。
作者: dysnxp    時間: 2023-11-7 01:22
學習學習?。?!
作者: playba    時間: 2023-11-18 14:37
這個很牛啊。學習一下
作者: 18972499663    時間: 2023-12-4 20:49
學習學習
作者: 可樂不加冰    時間: 2023-12-12 21:40
來晚了 來晚了
作者: Su2Seven    時間: 2024-1-2 02:13
參觀學習

作者: 賀蘭生    時間: 2024-8-22 15:42
在老站的時候收藏過,再收藏一下
作者: buzhaoshan    時間: 2024-12-3 18:30
這個必須支持
作者: 倪風    時間: 2025-1-7 21:58
感謝分享
作者: ?DZ插件開發商    時間: 2025-3-13 08:45
提示: 作者被禁止或刪除 內容自動屏蔽
作者: 海哥    時間: 2025-7-2 11:54
學習了
作者: lilin    時間: 2025-7-15 18:31
學習一下
作者: 龍神    時間: 2025-8-27 21:15
#在這里快單頁文件php如下hide速回復#




歡迎光臨 Discuz! 官方交流社區 (http://www.9999xn.com/) Powered by Discuz! W1.0