本帖最后由 騎驢追火箭 于 2020-3-6 09:58 編輯
第一、做discuz門戶模板首先你要會PS, 設計出你的網頁,當然其他軟件也行,或者模仿一下別人的網站也可以。然后切圖,排版,成為靜態HTML文件,測試好兼容性。
1.jpg (66.11 KB, 下載次數: 24)
下載附件
2020-3-6 09:32 上傳
這里不詳細說了。要是不懂html 還是需要去學一下再來看。 做好準備以后下面開始往DZ里面套! 二、(說明下這里只說的是門戶頁,因為BBS頁的風格我還沒研究,所以先用默認的BBS風格) 1、為了不影響默認風格,首先我們復制一份默認風格見下圖:
2.jpg (62.57 KB, 下載次數: 25)
下載附件
2020-3-6 09:50 上傳
2、到template目下創建一個文件夾。名字自取,我這里就叫test1.
3.jpg (44.12 KB, 下載次數: 24)
下載附件
2020-3-6 09:51 上傳
3、到模板管理里面新增一個模板。名字自取,路徑指定到剛才新建的文件夾。如下圖
4.jpg (26.71 KB, 下載次數: 24)
下載附件
2020-3-6 09:51 上傳
4、設置好以后 編輯剛才復制出來的風格,如下圖
5.jpg (43.79 KB, 下載次數: 24)
下載附件
2020-3-6 09:54 上傳
5、設置好以后把這個風格設置為默認。 三、下面開始正式門戶制作。 1、在剛才template建立的test1文件夾下面創建2個文件夾分別命名為 common 和 portal。 2、到templatedefaultcommon下面復制 common.css head.htm和footer.html 粘貼到template est1common。 這里我們先不制作頭部和底部先用默認的頭和底。 3、然后把你設計的靜態頁面命名為index.htm復制到 emplate est1portal下。 4、在論壇所在根目錄下創建一個名為test1的文件夾,最好和你的新增模板的文件夾名字一樣或者相似。只要自己方便識別就行。建立好之后 把你靜態頁面的 css文件 圖片文件 js文件等 全部復制到這個文件夾里面。 四、以上完成之后刷新下你的門戶發現是沒有加載樣式的。 這表示你前面的工作成功,下面開始改代碼! 1、首先把你的靜態頁面的以上和一下全部刪掉,包括body標簽。 2、把這句代碼 <!--{subtemplate common/header}-->
復制代碼復制到文件最頂部,下面這段復制到最底部 <!--{subtemplate common/footer}--> 復制代碼 3、把你的CSS文件調用進來,放到<!--{subtemplate common/header}--> 下面就可以了,下面是我的,改好路徑就好了。這里應該把CSS js全部調用進來。
復制代碼 4、保存好后刷新下門戶發現 出了圖片 基本框架都出來了。 圖片錯誤是因為路徑不對。把路徑全部改過來。 在原來路徑前面加上剛才在根目錄下創建的文件夾的名字就好了,全部替換就可以了。如圖
6.jpg (21.98 KB, 下載次數: 23)
下載附件
2020-3-6 09:55 上傳
五、到此你的靜態網頁已經轉換到DZ下了。下面開始添加框架和模塊。 1、首先把不帶CSS的標簽替換成。<!--[diy=diy1]--> <!--[/diy]-->
1-1、這個<!--[diy=diy1]-->具體什么意思我也不知道,反正規則是 <!--[diy=diy1]-->diy1 要和他所包含的的DIV標簽的ID保持一致,且具有唯一性.class=“area”保持不變。比如下圖。飄紅的部分是替換的。如圖第二部分顯示所有的都是diy1這樣就錯了。要保持唯一性。不能重復! 如圖二。
7.jpg (69.06 KB, 下載次數: 24)
下載附件
2020-3-6 09:55 上傳
這部分替換后 我們就可以去diy頁面添加框架和模塊了 六、1、首先添加框架如下圖。 把所有框架的 標題全部去掉。
8.jpg (71.84 KB, 下載次數: 23)
下載附件
2020-3-6 09:56 上傳
至此,大概就這樣了,后期的就自己研究吧。 聲明:此教程不是本人所編輯,教程來源于賢相網絡(www.k58x.com)網站.
|