SchoolPAD SchoolPAD
基礎教育訓練 基礎教育訓練
1
黑快馬股份有限公司 講師：John
基礎教育訓練
基礎教育訓練
課程大綱 課程大綱
1. 基本概念介紹(前後台概念)
2. 基礎功能操作(修改樣式，內容建立) 3. 主要模組功能操作(主題、連結模組) 3. 主要模組功能操作(主題、連結模組) 4. 自訂模組應用
5. Q&A
前台介紹
前台介紹
頁面頭部
頁面頭部
主要
主要頁面資訊區塊 頁面資訊區塊
頁面底部
頁面底部
後台 後台
什麼是後台？
什麼是後台？
如何進入後台？
如何進入後台？
（1）前台：
7
（1）前台：
http://www.xxx.edu.tw
（2）後台：
http://www.xxx.edu.tw/backoffice/
進入後台登入畫面 進入後台登入畫面
在網域名稱後加入 backoffice
後台
後台--登入畫面 登入畫面
9
後台頁面介紹
後台頁面介紹
頁面樣式選擇 頁面樣式選擇
11
首頁精靈介紹 首頁精靈介紹
※
※功能： 功能：
（1）調整首頁比例大小。
（2）加入模組、移動模組。
（3）點選模組修改。
首頁精靈畫面 首頁精靈畫面
13
首頁精靈操作 首頁精靈操作
首頁精靈可以修改 首頁精靈可以修改… …
1.頁首：Logo， benner，網站名稱，網站 標語，頁首連結
2.頁中：修改頁面比例，擺放模組
3.頁尾：編輯頁尾內容
頁首：首頁精靈
頁首：首頁精靈→ →頁首 頁首
放圖片：logo + banner 放文字：
logo
15
放文字：
網站名稱+網站標語+快速連結
logo banner
1、分三部份(左中右)
2、可以調比例大小(100%)
logo banner
20% 60% 20%
頁中：內容陳列區 頁中：內容陳列區
3、可以移動、加入模組
4、新增模組方式：滑鼠拖曳+點選
（在各欄最下方）
頁尾
編輯聯絡人資訊
(ex：Tel 、FAX 、Address…)
logo banner
頁尾：首頁精靈
頁尾：首頁精靈→ →頁尾 頁尾
17
(ex：Tel 、FAX 、Address…)
產權宣告
(ex：圖文版權所有翻印必究)
logo banner
頁尾
練習時間 練習時間
1. 修改頁面樣式
2. 修改網站標語、擺放Logo、網站連結
3. 修改頁尾聯絡資訊
19
分類清單：網站的主選單，
呈現的是秩序井然的網頁架 構，依照分類層次擺放資料
點我
內容分類建立 內容分類建立
1. 目的：建立一個主功能選單、或是一個網 站的分類架構。
2. 方法：
2. 方法：
內容管理/內容分類建立。
內容管理/下級分類建立。
內容明細建立 內容明細建立
1.目的：發佈一則新訊息到分類清單。
2.方法：內容管理/內容明細建立 3.步驟：
〈1〉內容名稱。
21
〈1〉內容名稱。
〈2〉編輯詳細內容。
〈3〉加入分類清單。
附加檔案 附加檔案
1、目的：在內容明細裡，上傳一個檔案供 瀏覽者下載。
2、方法：內容管理/附加檔案建立。
3、步驟：
3、步驟：
〈1〉新增(查詢)一筆內容明細。
〈2〉瀏覽附加檔案建立。
〈3〉填寫檔案說明→點瀏覽上傳
內容管理功能 內容管理功能
23
基本概念 基本概念
※
※基本操作方法 基本操作方法
•
紅色標題:唯一值(不可重複)，英數 粗黑體:必填欄位
• 後台有修改時，前台要 reflash (重新整理)
• 後台有修改時，前台要 reflash (重新整理) 功能按鈕：新增、查詢、修改、刪除
•
圖片支援格式: jpg、gif、swf、bmp
圖片檔名:建議使用英數
1. 建立上級分類與下級分類
2. 建立兩筆資訊（純文字與HTML格式) 3. 將新增好的文件放置於分類中
練習時間 練習時間
25
什麼是模組？
什麼是模組？
模組:
由不同的零件所組成，具備某種特定 功能的組件。
功能的組件。
Q：這裡有幾個模組？
27熱門公告區：想要從資料架構裡
29
想要單純的顯示網頁連
結，稱為連結模組。
如何公告訊息 如何公告訊息
1. 目的：建立一個公告區，發布訊息。
2. 方法：模組管理／主題模組建立
內容管理>內容明細建立(一次一筆)
內容管理>內容明細建立(一次一筆)
內容管理>多功內容維護(一次多筆)
公告訊息 公告訊息
31
新增模組
新增模組((首頁精靈 首頁精靈→ →各欄最下方 各欄最下方))
練習時間 練習時間
1. 建立一個主題模組，並將現有的資訊加入 於模組中
2. 將建立好的主題模組放置於頁面 3. 修改主題模組資訊的顯示方式 3. 修改主題模組資訊的顯示方式
33
連結模組建立 連結模組建立
1. 目的：建立一個友情連結、或是一個對外 的熱門連結。
2. 方法：
模組管理／相關連結模組
模組管理／相關連結模組
模組管理／相關連結建立
連結模組建立 連結模組建立
35
1. 建立一個連結模組，可連結至其他網頁 2. 選擇模組的顯示方式是標題或圖片
3. 將新增好的模組放置於頁面中
練習時間
練習時間
圖形管理 圖形管理
1、目的：供html編輯器插入圖片時使用。
2、方法：圖形管理/文檔管理系統。
3、步驟：
〈1〉開啟並命名一個新資料夾。
37
〈1〉開啟並命名一個新資料夾。
〈2〉瀏覽某一個檔案 (不可RAR)
〈3〉點選上傳。
自訂模組
自訂模組
自訂模組
自訂模組
自訂模組建立 自訂模組建立
39
自訂模組的應用 自訂模組的應用
• 目的：於模組中嵌入語法建立特殊功能
• 方法：模組管理>自訂模組建立
• 步驟：
1. 輸入自訂模組標題
2. 於HTML格式輸入語法
自訂模組範例：嵌入影片 自訂模組範例：嵌入影片
41
自訂模組範例：嵌入影片
自訂模組範例：嵌入影片
自訂模組範例：嵌入影片 自訂模組範例：嵌入影片
43
