線上書籍

Home

XOOPS 新版佈景設計

一、XOOPS佈景設計須知
  1. 要設計一個佈景,至少要懂HTML+CSS,有時還需要懂一些jquery,要設計一個可以再各種裝置都可以看的佈景,還需要懂得自適應設計(Responsive Web Design),要設計一個XOOPS佈景,您還得要懂smarty佈景引擎語法。
  2. 正常的XOOPS佈景開發大致流程為:先做一個普通的HTML網頁,然後,套上XOOPS專屬的smarty佈景標籤,這樣就成了XOOPS佈景。
  3. 可控制的XOOPS佈景則是可以讓使用者透過Tad Themes模組來針對佈景做設定,TadTools已經有內建一些共同樣板,所以,可以選用降低開發難度。
  4. 佈景開發重點在於了解XOOPS的樣板結構及原理,因為XOOPS的樣板分成三大部份:主樣板、區塊樣板、模組樣板...等,尤其XOOPS2.5之後又加入了不少新功能,所以,這部份盡可能的去了解它的結構以及作用範圍,如此,日後才能隨心所欲的想改哪裡就改哪裡。
二、 設計佈景的正確觀念
  1. 版型不應該用Table來建立,而是應該用<div>或<span>這類本身不具意義的標籤來規劃版型。用表格會缺乏彈性,而且也不是新一代網站的正確作法,表格就應該拿來當作表格用。
  2. HTML用來作為網頁結構的規劃,而非外觀的設計。外觀一律建議使用CSS來控制。
三、本次研習範例

嘉義場研習範例:http://www.templatemo.com/templates/templatemo_062_white

嘉義場研習範例下載:http://www.templatemo.com/preview/templatemo_062_white

臺南場研習範例:http://www.templatemo.com/templates/templatemo_353_beauty_class/

臺南場研習範例下載: http://www.templatemo.com/preview/templatemo_353_beauty_class

四、 開發工具:Sublime NotePad++
  1. Sublimeyes是小弟的主力工具,大力推薦,不過不是免費軟體。
  2. NotePad++解壓縮後,直接執行npp/notepad++.exe即可。