自訂頁面,提供彈性的排版與內容設計,建立時可以直接套用已經設計好的「樣版」或依下列步驟設計。
  1. 版面設計 (排版)
    以列 (row) 為單位設計,將上方的「內容區塊」,拖曳到適合的位置。
     
  2. 內容模組安排
    內容呈現採模組化的設計,每一個內容區塊,可以放多個模組,做法很簡單,將「模組清單」或「公告模組」內的模組,拖曳到排版好的「內容區塊」內就可以了。
     
  3. 設計內容
    設計模組的內容與設定,例如編輯 html or 圖片輪播的圖片與顯示方式。af31c869ba18c1970d0b1acdf9ee8794.png
  4. 以下是自訂頁面的結構說明。
重點
  1. 1.
    內容區塊 (排版)
    34cd9fcd7bbfa79b138dd0c6875d3c31.png可以設計一行 (row) 有幾欄,呈現時,會依據手機、平版的寬度自動調整。
    1. 電腦
      依據設定的欄位排版。
       
    2. 手機
      因為顯示寬度不足,通常會顯示成一欄 (如右圖)。
       
    3. 平版
      若勾選「版面支援」設定中的「平版」 (下圖箭頭處),當平板的解析度 >=768px 時 ,就會維持多欄排版。
        
  2. 2.
    內容置中 or 全版面顯示
    由於顯示器的解析度變化很大,除非特殊考量,建議置中顯示,因為內容的排版會比較容易。
  3. 3.
    其他功能說明
    2be601cc89e86c73952d93f746ef41a1.png
    摘要說明如下:
    1. 區塊整列 (row) 樣式
      設定一整個 row 區塊的樣式,例如: 背景圖片、CSS 設計等。
       
    2. 區塊樣式
      個別區塊的樣式設定。
       
    3. 模組外觀
      包括標題、圖片、框線 ... 等fb289f1a84fb031ac87d4b38f238cb6c.png
    4. 動畫設計
      捲動到模組的位置時,用動畫的方式呈現。
       
    5. 模組內容
      設計模組的內容,例如,「HTML 模組」的內容編輯 、「圖片輪播模組」的圖片與顯示方式。
       
    6. 停用 / 啟用
      設計中的模組,可以透過停用關閉不顯示。