Revision of 教學: 建立 Zen subtheme from Mon, 2011-12-19 21:40

Zen 稱它是 Drupal 內的最好的初始版型Drupal.
"如果你要建立一個符合規範的版型, 你會發覺, 使用 Zen 會比修改 Garland 或者 Bluemarine 容易得多"

它的 README 有一步一步的教學:

  1. 將 Zen 內的 STARTERKIT folder 複製到 zen 之外, 並修改資料夾名稱為你的版型的名稱.
    但留意, 版型的名稱一定使用小階的英文字母作開頭, 名稱只可以包含小階的英文字母, 數字和底線 (underscores)

    例如, 複雜 sites/all/themes/zen/STARTERKIT 資料夾, 重新命名為 sites/all/themes/foo
    這個步驟的目的是令你的客製版型 (sub-theme) 有一個自己的資料夾. 這會令 zen 版型的升級更容易.
  2. 在你的新版型的資料夾, 將 STARTERKIT.info.txt 重新命名為你的版型的名稱, 然後移除 .txt 這個副檔名. 再修改 .info 檔案內的 "name" 和 "description" 欄位

    例如, 重命名 foo/STARTERKIT.info.txt 為 foo/foo.info.
    將 foo.info 內的 "name = Zen Sub-theme Starter Kit" 修改為 "name = Foo" and
    "description = Read..." 修改為 "description = A Zen sub-theme"
    <br />
    .info 檔案是提供一些有關這個版型的基本資料給 Drupal: 名稱, 簡介, 功能, 區域, 包含的 CSS 檔和 JS 檔等. 詳情可以到 http://drupal.org/node/171205 了解更多

    最後, 到 admin/build/themes 以更新 Drupal 6 的緩存

  3. zen 的 STARTERKIT 預設是使用指定闊度的版面的. 如果你需要的是一個浮動的闊度的版面的話, 你可以刪除 layout-fixed.css 和 layout-fixed-rtl.css files 然後修改 sub-theme 的 .info 檔案, 將 layout-fixed.css 締換為 layout-liquid.css

    例如, 修改
          stylesheets[all][]   = css/layout-fixed.css

          stylesheets[all][]   = css/layout-liquid.css
    <br />
    .info 內的 "stylesheets" 定義版型內的 CSS 檔案路徑和 media type, 只要遵從以下的格式:
      stylesheets[MEDIA][] = path/to/file.css
    <br />
    然後到 admin/build/themes 以清除緩存
    <br />
    如果你使用其他的 CSS 版型, 例如 Blueprint 或 960.gs 你可以締換 "css/layout-fixed.css" 成你喜歡的版型的 CSS 檔案
  4. 修改 template.php 和 theme-settings.php 內的 "STARTERKIT", 修改成你的 sub-theme 的名稱

    我們建議你使用文字修改器, 使用 "搜尋和締換全部" 的功能來完成修改

  5. 使用 administrator 登入, 到 Administer > Site building > Themes (admin/build/themes) 和啟用你的 sub-theme
  6. Internet explorer 有一個 bug 令你不可以使用超過 31 個 CSS 檔. 在發版型的期間, 你可以下載 "IE CSS Optimizer" 模組http://drupal.org/project/ie_css_optimizer 以避開這個限制

    在 live 的環境, 你應該啟用在效能頁面的 CSS 優化設定

  7. 可選設定

  8. 修改 ZEN 的核心 template 檔案:
    如果你需要修改在 zen 資料夾內的 .tpl.php 檔案, 複製那檔案到你的 sub-theme 的 template 資料夾, 再修改之, 最後再清除緩存

    例如, 複製 zen/templates/page.tpl.php 到 foo/templates/page.tpl.php.

  9. 修改搜尋表單的 template:
    複製 modules/search/ 內的 search-theme-form.tpl.php 到 sub-theme 資料夾, 清除緩存.

    Drupal 核心的 templates 的列表可以到以下的網址查閱:
    http://drupal.org/node/190815
Google