入門篇
如果您已經瞭解基本的風格製作,您可以跳過此部分。
當然,本文在入門的基礎上會進行一定的擴展,可不要錯過了哦。

關於 Discuz 的安裝使用,模板開發等教程,大家請查看由薇曉朵錄製的 《Discuz 視頻教程》

1. 瞭解 Discuz 的模版機制
Dz 的模版風格由兩個主要部分組成:一是模版套系,二是界面方案。
默認模版套系是一切風格的根本,其位於論壇目錄下的 templates/default,可以看到其中有很多的 htm 文件,這就是 DZ 的模版。今後的一切修改都要基於這個目錄下的文件。
如果説模版套系是骨架,那麼界面方案就是模版風格的血肉。其規定了模版風格的名稱,使用的界面圖片目錄和 Smilies 圖片目錄,以及決定風格表現的字體,表格,顏色。
瞭解了這些,對我們開始進行模版風格的製作是非常重要的。

2. 製作屬於自己的第一個風格
大多數情況下,我們只是希望風格能切合自己的論壇主題,而不是其他的什麼。為了避免千篇一律,才有了許許多多的風格,本節中,我們通過修改界面方案,來製作屬於自己的第一個風格。

假設你要製作一個環保網站,而 DZ 默認的藍色又不能很好的體現這個主題,我們首先想到的就是找一個綠色的模版。就在這時,你看到了一個很不錯的綠色模版。

eg.jpg

你很想使用這個模版,但是站長竟然不允許!沒辦法,自己動手,豐衣足食。
(在這裏要説明,我並不提倡在沒有站長同意的情況下 Rip 網站的風格,畢竟是他人辛勤勞作的結晶)

我們來到自己網站的後台 (以 D5 為準) 。論壇管理——> 界面風格,看到如下界面。

pic2.jpg

在新增處填上您想要的風格名字,然後提交。這時新的界面已經添加成功了,我們點擊詳情。
裏面還是空空如也,接下來就要開始風格製作啦!
首先是基本的風格設置

界面方案名稱:(您設定的值)
匹配模板: 默認模版套系
論壇 logo:(您設的 Logo 地址)
界面圖片目錄:images/green(請創建這個目錄)
Smilies 圖片目錄:images/smilies 默認表情目錄即可

接下來是文字的設置。您可以對照默認的風格來進行設置。

Tips: 其他可以對照默認風格的選項
外表格寬度
主表格寬度
主表格邊緣空隙
主表格邊框寬度
主表格內邊框寬度

直到這一步 內表格中超級鏈接文字顏色,不能按照默認的設置了,因為接下來的設置都涉及到模版的配色了。

怎麼辦?您要去下載一個吸色器 http://www.skycn.com/soft/20596.html
之後對比下圖來獲取目標論壇 (本例中的 http://www.5d6d.com/bbs.php) 的不同部分的顏色。填入編輯界面方案之中。

s1.gif

s2.gif

s3.gif

看看你的配色和教程中的有什麼不同,這裏使用的是翅膀。提供的配色方案。

ps.jpg

完成啦!提交吧。
我們通過 index.php?styleid=您的 styleid(例如 index.php?styleid=3) 來看看剛才製作的風格。

demo.jpg

……怎麼會這樣?
因為沒有傳圖片。每個風格可以使用單獨的圖片目錄以配合風格配色,記性好的朋友應該還記得開始設置了 images/green,我們到 http://www.5d6d.com/bbs.php 上把需要用到的文件全部另存為到這個目錄中。

Tips:
為了防止圖片缺漏,您可以對比默認圖片目錄中的文件保存目標網站的模版圖片。

再看看……

demo2.jpg

大功告成,您的第一個自己製作的風格就這樣完成了。
現在,您可以導出您製作的風格,並與圖片文件一起打包,發到網上與朋友們共享了!