更換不同的版型

Download Report

Transcript 更換不同的版型

基礎篇part.3 : 課程大綱

1.

2.

3.

4.

5.

頁面樣式變更:更換不同的版型

首頁連結設定:橫幅下拉式選單 廣告模組:網頁頭部的變化 選單模組:除了主選單的選單製作 文檔系統:檔案總管的概念

ePage教育訓練 (基礎篇:part.3-1)

頁面樣式變更: 更換不同的版型

講義編撰者:李嘉宇 (分機:1613)

主題一

主題一

頁面樣式的變更中的版型為系統內定 版型的樣式與組數為系統內定,故若要做出自我風格的版型,就須自行撰寫

• • 照範本的css標籤做整個版型 利用頁首、頁尾、自訂模組與自訂模組外觀做出局部的版型設定

每個版型的寬度和間距都內設值

故選擇不同的版型其頁面中模組顯示定位點、文字、模組外觀 都會一選擇版型不同而不同

主題一

頁面樣式的變更的位置

在後台選擇『頁面樣式』-> 『頁面樣式變更』 開啟系統版型選單(勾選選擇)

主題一

頁面樣式的操作:修改版型(1/2)

後台版型選項 會停留在前台所顯示的版型上

前台顯示 後台顯示

主題一

頁面樣式的操作:修改版型(2/2) 後台顯示

更改選擇的版型併案下儲存, 後台頁面就會出現『操作成功』提示

前台顯示

在後台的右上 按下『網站首頁』 前台的版型就會變成 後臺所選擇的版型

主題一

新增自訂版型 選擇新增自訂版型選項,跳出 新增自訂版型設定視窗

1.請下載 自定樣式幫助手冊 ,根據幫助說明,制作屬於您自己的版型 (可以參考此 樣式範例 ) 2.版型的外層目錄爲 style , 必須包含 style.css , small.png, large.png

style.css 爲樣式設定檔案 small.png 爲版型縮略小圖 large.png 爲版型大圖 3.完成後,將 style 目錄壓縮成一個 zip 檔.

4.上傳製作好的 zip 檔.

P.S.新增自訂版型為進階功能,日後章節補充 (需要會寫CSS語法與美工版型製作)

主題一

樣式設定

選擇

樣式設定

後,跳出

樣式設定 視窗

此功能需要與

頁面樣式 中 P.S.新增自訂版型為進階功能,日後章節補充 (需要會寫CSS語法與美工版型製作) 後台顯示

主題一

內建樣式款式part.1.系列款式 相同款

有些模板的款式為相同,只有配色相異 有些則為單獨款式

相同款

(內定)版型寬度不同、文字顏色不同、模組外觀不同、 模組與模組、頁首logo、廣告…等定位點不同

相同款

頁尾不同、背景不同…等

p.s.相同系列款式,以同樣外框顏色標示 相同款 相同款 相同款

主題一

內建樣式款式part.2.獨立款式

有些模板的款式為相同,只有配色相異 有些則為單獨款式 (內定)版型寬度不同、文字顏色不同、 模組與模組、頁首logo、廣告…等定位點不同 頁尾不同、背景不同…等

p.s.框選的版型為獨立款

主題一

內建樣式款式part.3.校內單位風格款式

有些模板的款式為相同,只有配色相異 有些則為單獨款式 (內定)版型寬度不同、文字顏色不同、模組外觀不同、 模組與模組、頁首logo、廣告…等定位點不同 頁尾不同、背景不同…等

p.s.此四種版行為廠商自製的版型

主題一

頁面樣式變更使用注意事項 請注意更換版型內設的寬度、定位點、模組外觀的不同

會影響資料與物件擺放的位置、與圖片的寬度 若相關物件或圖片超過所在內定的寬度,都會呈現暴版的狀況

模組外觀的設定儘量以搭為主題來選擇

模組外觀的內定有三、請一版型整體搭配來選擇 若要自製或上傳圖片也請顧慮到所在的欄位寬度(超過預設,就會呈現超過版面(暴版)的 狀況)

主題一

1. 更換不同的版型 2. 頁面樣式變更操作 3. 內建樣式款式與使用注意事項