Tad 教材網 - 線上書籍

:::

7-2 theme2014/theme.html （主佈景架構） next

\[1031\]XOOPS佈景設計
=================

[![](http://tad0616.net/uploads/dl.gif)](http://www.tad0616.net/uploads/tad_book3/file/1031/theme_demo.zip)

1. 在 themes 建立資料夾，例如 school2014，以下稱之為「佈景目錄」
2. 建立 theme.html 至佈景目錄中， theme.html 需要以下樣板檔（紅色的部份才是我們要編輯的檔案）： 
 1. tadtools/themes\_tpl/get\_var.html （用來獲取佈景所有設定值，置於/tadtools/themes\_tpl/ 中，已內建）
 2. tpl/head.html（載入「網頁檔頭」樣板檔，置於自身佈景目錄 /tpl 中，需自行產生） 
 1. tadtools/themes\_tpl/meta.html（載入網頁meta設定，置於/tadtools/themes\_tpl/ 中，已內建）
 2. tadtools/themes\_tpl/link\_css.html（載入各種CSS設定檔，置於/tadtools/themes\_tpl/ 中，已內建） 
 1. css/xoops.css（載入 XOOPS 基本 CSS 樣式，置於自身佈景目錄 /css中，需自行產生）
 2. css/style.css（載入佈景相關 CSS 樣式，置於自身佈景目錄 /css中，需自行產生） 
 - css/block.css（載入區塊 CSS 樣式，置於自身佈景目錄 /css中，需自行產生）
 3. 另外還會載入各式XOOPS內建的CSS以及Bootstrap的CSS等，由於不是可以修改的部份，故略過。
 3. tadtools/themes\_tpl/theme\_css.html（套用Tad Theme中的CSS設定，置於/tadtools/themes\_tpl/ 中，已內建）
 3. tadtools/themes\_tpl/navbar.html（載入導覽列，置於/tadtools/themes\_tpl/ 中，已內建） 
 1. tadtools/themes\_tpl/menu\_main.html（載入下拉主選單，置於/tadtools/themes\_tpl/ 中，已內建）
 2. tadtools/themes\_tpl/menu\_my.html（載入自訂選單，置於/tadtools/themes\_tpl/ 中，已內建）
 3. tadtools/themes\_tpl/menu\_user.html（載入使用者選單，置於/tadtools/themes\_tpl/ 中，已內建）
 4. tadtools/themes\_tpl/menu\_login.html（載入登入界面，置於/tadtools/themes\_tpl/ 中，已內建）
 4. tpl/header.html（載入「頁首」樣板檔，置於自身佈景目錄 /tpl 中，需自行產生） 
 1. tadtools/themes\_tpl/slideshow\_responsive.html（載入滑動圖文，置於/tadtools/themes\_tpl/ 中，已內建 ）
 5. tpl/$theme\_type.html（載入「網頁布局」樣板檔，置於自身佈景目錄 /tpl 中，需自行產生） 
 1. tpl/leftBlock.html（載入「左區域」樣板檔，置於自身佈景目錄 /tpl 中，需自行產生）
 2. tpl/rightBlock.html（載入「右區域」樣板檔，置於自身佈景目錄 /tpl 中，需自行產生）
 3. tpl/centerZone.html（載入「中間區域」樣板檔，置於自身佈景目錄 /tpl 中，需自行產生） 
 1. tpl/centerBlock.html.html（載入「上中區域」樣板檔，置於自身佈景目錄 /tpl 中，需自行產生）
 2. tpl/centerLeft.html（載入「上中左區域」樣板檔，置於自身佈景目錄 /tpl 中，需自行產生）
 3. tpl/centerRight.html（載入「上中右區域」樣板檔，置於自身佈景目錄 /tpl 中，需自行產生）
 4. tpl/xoopsContents.html（載入「主內容」樣板檔，置於自身佈景目錄 /tpl 中，需自行產生）
 5. tpl/centerBottom.html（載入「下中區域」樣板檔，置於自身佈景目錄 /tpl 中，需自行產生）
 6. tpl/centerBottomLeft.html（載入「下中左區域」樣板檔，置於自身佈景目錄 /tpl 中，需自行產生）
 7. tpl/centerBottomRight.html（載入「下中右區域」樣板檔，置於自身佈景目錄 /tpl 中，需自行產生）
 8. tpl/leftBottom.html（載入「左下區域」樣板檔，置於自身佈景目錄 /tpl 中，需自行產生，僅 theme\_type\_8.html 會用到）
 9. tpl/rightBottom.html（載入「右下區域」樣板檔，置於自身佈景目錄 /tpl 中，需自行產生，僅 theme\_type\_3.html、theme\_type\_4.html、theme\_type\_8.html 會用到）
 10. tpl/blockTitle.html（載入「區塊標題」樣板檔，置於自身佈景目錄 /tpl 中，需自行產生，上述每個區域樣板檔均會載入此檔）
 6. tadtools/themes\_tpl/show\_var.html（開發佈景時用來顯示佈景所有設定值，置於/tadtools/themes\_tpl/ 中，已內建，做完佈景可刪除）
 7. tpl/footer.html（載入「頁尾」樣板檔，置於自身佈景目錄 /tpl 中，需自行產生）
 8. tadtools/themes\_tpl/bootstrap\_js.html（載入bootstrap設定，置於/tadtools/themes\_tpl/ 中，已內建 ）
 9. tadtools/themes\_tpl/my\_js.html（載入自訂js，用來使左右區塊高度統一，置於/tadtools/themes\_tpl/ 中，已內建 ）
3. 編輯 config.php 及 theme.ini 等基本設定。

:::