Tad 教材網 - 線上書籍

:::

\[972\]CSS打造XOOPS佈景
===================

[![](http://tad0616.net/uploads/dl.gif)](http://120.115.2.76/tad/tad_book3/file/bluefish/09.zip)

### 一、XOOPS的樣板

1.XOOPS採用Smarty樣板引擎。  
 2.所謂樣板，就是html檔。  
 3.在XOOPS中，樣板到處都有，XOOPS的外觀就是由以下樣板組成的。  
 (1) 佈景樣板：/themes/佈景/\*.html  
 (2) 模組樣板：/modules/模組/templates  
 (3) 區塊樣板：/modules/模組/templates/blocks  
 4.模組樣板以及區塊樣板是由模組提供，安裝模組時，會將其樣板讀入資料庫，以利線上編輯或控管。

![](http://tad0616.net/uploads/tad_book3/image/10000000000001F40000029E02847232.png)

### 二、XOOPS的佈景目錄

1.XOOPS的佈景目錄在themes下，一個資料夾就是一套佈景。上傳佈景時，將佈景上傳到themes下即可。  
 2.所謂佈景，就是由theme.html以及CSS檔、圖檔，組合而成的。  
 3.theme.html規範著整個網站的畫面布局結構，此檔無法由線上編輯。  
 4.為了不讓theme.html太複雜，有時後會將某區域的樣板獨立出來，所以，除了theme.html以外，佈景目錄下還會有一堆其他的html檔。

### 三、XOOPS的佈景設定

1.安裝佈景時，請到後台「一般設定→基本參數設定」，進行以下動作：  
 (1) 選取「用戶可選擇的佈景」，選越多，用戶可選用的佈景越多。  
 (2) 「預設佈景」則是網站預設使用的佈景。  
 (3) 「從/themes/yourtheme/templates更新模組的樣板文件」指的是不去讀取樣板快取檔，而是直接去讀佈景，理論上，效能會比較不好（其實沒什麼感覺），但修改佈景時會比較容易。  
 2.「控制面板界面」指的就是後台樣板，和我們的佈景檔沒多大關係。  
 3.「預設樣板組」指的就是模組提供的模組樣板以及區塊樣板組合，未來要修改區塊外觀以及模組外觀時才用得到。

### 四、製作XOOPS的佈景流程

1.先設計好一個完整的網頁→把網頁變成XOOPS樣板→套用後進行CSS微調。  
 2.新增一組「樣板組」複本，開始修改各區塊或模組外觀，以配合佈景風格。

### 五、XOOPS的佈景網站

1.http://themes.ck2tw.net/(中)  
 2.http://www.eduweb.com.tw/xoops/html/(中)  
 3.http://web.center.mlc.edu.tw/modules/mydownloads/viewcat.php?cid=5(中)  
 4.http://cmsfamily.cn/modules/mydownloads/viewcat.php?op=&cid=1(中)  
 5.http://demo.2bcool.net/index.php(日+英)  
 6.http://hello.oceannet.jp (日)  
 7.http://xoopsfactory.com/(英)  
 8.http://www.7dana.com/download/pafiledb.php?action=category&id=1 (英)  
 9.http://www.xoops.org/modules/news/index.php?storytopic=3 (英)  
 10.http://www.xoops.org/modules/library/viewcat.php?cid=1 (英)

:::