iT邦幫忙

4

[鐵人賽Day8]DotNetNuke-新增頁面與模組

DotNetNuke中的每個Page(Tab)就是一個網頁頁面,在頁面當中我們可以放置許多模組,不同的模組的內容都會存放在資料庫當中,包含頁面的設定與相關資訊,當使用者瀏覽某個頁面時,DotNetNuke會從資料庫中讀取頁面的設定,接著讀取頁面中所放置的模組資訊,將模組載入到頁面中,最後再透過模組的程式將存放在資料庫中的模組內容載入,完成一個頁面的呈現。
現在就讓我們來試著在DotNetNuke中新增一個頁面,並且放置一個DotNetNuke內建的HTML模組吧!

首先,登入最高權限管理員或網站管理員的帳號(註1),接著在上方的選單選擇「Pages」→「Add New Page」。

接著出現頁面的設定畫面,簡單的針對幾個欄位進行說明:

.網頁名稱:顧名思義就是網頁的名字,如果有勾選最下面「加入主選單中」的選項則會顯示在網站選單中,也是網站導覽列的顯示名稱。
.網頁標題:會顯示在瀏覽器的頁籤上。
.Page URL:指定URL Rewrite的網址。
.說明:HTML中Meta標籤的description內容,搜尋引擎會用到。
.關鍵字:HTML中Meta標籤的Keywords內容,搜尋引擎會用到。
.父網頁:指定這個頁面在哪一個頁面的底下,會在網站選單中建立階層式的選單項目,沒有設定則是代表它是父網頁。
.插入頁面:這邊可以選擇新增頁面在哪一個頁面的前面或後面,或者是選擇「加至結尾」把頁面放到最後面。

新增一個網頁名稱為TestPage且網頁標題為測試網頁的頁面:

在DotNetNuke中,預設在新增頁面的時候就會自動幫我們加入一個HTML的模組:

Enter Title是HTML模組預設的Title標題文字,而藍底內容為Visible By Administraters Only的意思是告訴我們目前這個模組只能被管理者看見,因為我們還沒有設定頁面的權限,因此模組繼承頁面的權限就變成只限管理者可以看得見了,網頁實際在呈現的時候並不會出現藍底的畫面。我們可以先點選右上角的鉛筆圖示,接著再點選單中出現的Edit Content項目來編輯這個HTML模組的內容。

接著就會出現HTML模組內容的編輯畫面,HTML編輯器中預設會幫我們帶入Add Content…來提醒我們加入一些內容進去,編輯完成後就按下面的Save。

(HTML模組還有歷史版本的功能,也就是多次編輯之後可以選擇回復到之前的版本內容,礙於篇幅就不在這邊介紹了,未來有機會針對不同模組撰寫專文介紹的時候再說吧!)

接著我們再自己手動來新增一個HTML模組吧!請點選上方Modules選單中的Add New Module項目:

出現選擇模組的區域,找到「HTML」模組:

接著有兩種方式可以將模組新增到頁面上,第一種是利用拖拉的方式將模組拖拉到頁面上的xxxPane區域,第二種是將滑鼠移到HTML模組的右上角,會出現選單讓管理者選擇加入到哪一個Pane區域中。

要知道目前的頁面有哪些Pane區域,或者是這些Pane區域是如何設計(佈局)的,可以勾選右上角Edit Page選單中的View in Layout Mode選項。

勾選之後網頁會自動重新整理,然後就可以看到網頁中的Pane設計,而紅框的部份是新增頁面時預設加入的HTML模組,是放置在contentPane的區域當中。

回到剛才新增模組的步驟,我們將HTML模組加入到rightPane來看看實際的效果:

做完這些動作之後,這些內容還是只有管理者可以看得見,這也防止我們還在編輯內容的時候會讓使用者不小心看到未完成的內容,所以我們完成頁面的內容編輯之後,我們必須再設定頁面的權限來決定讓哪些使用者可以看到這個頁面,所以我們接下來就設定這個TestPage的權限讓所有使用者可以檢視這個頁面,也就是不需要登入的訪客也可以看得見這個頁面的內容。

同樣在畫面的右上角Edit Page選單中選擇Page Permissions選項:

接著出現頁面權限設定的畫面,將所有使用者的檢視網頁那一欄勾選起來之後按Update Page:

接著我們利用InPrivate模式來看看訪客瀏覽時呈現的樣子:

如果你覺得HTML模組的標題(Title)很礙眼,那麼我們回到管理者的登入畫面,在HTML模組的右上角齒輪圖示選單中點選「設定」的項目:

接著會出現HTML模組的設定畫面,將模組標題的內容清空,最後按下更新即可:

將兩個HTML模組的標題都清掉之後,再回到訪客的瀏覽畫面看一下,是不是順眼多了呢?!

註1:DotNetNuke的管理員帳號分為兩種,最高管理者權限和網站管理者,最高管理者權限帳號可以在每一個DotNetNuke的子網站使用,並且可以使用所有的功能。網站管理者帳號限制在相對應的網站才有權限,並且不能夠使用「主機」類的管理功能。

(本文同步發表於泰克哪裡去部落格)

[鐵人賽Day1]DotNetNuke簡介
[鐵人賽Day2]DotNetNuke安裝前置作業
[鐵人賽Day3]DotNetNuke安裝-傳統方式安裝在IIS
[鐵人賽Day4]DotNetNuke安裝-透過Web PI安裝
[鐵人賽Day5]DotNetNuke安裝-使用Windows Azure Website
[鐵人賽Day6]DotNetNuke網站結構說明
[鐵人賽Day7]安裝DotNetNuke語系
[鐵人賽Day9]第一個DotNetNuke模組-Hello DotNetNuke
[鐵人賽Day10]DotNetNuke模組的多國語系
[鐵人賽Day11]安裝DotNetNuke專案範本
[鐵人賽Day12]DotNetNuke模組設計範本–SimpleModule(1)
[鐵人賽Day13]DotNetNuke模組設計範本–SimpleModule(2)
[鐵人賽Day14]DotNetNuke模組設計範本–SimpleModule(3)
[鐵人賽Day15]DotNetNuke模組設計範本–SimpleModule(4)
[鐵人賽Day16]DotNetNuke使用篇–會員帳號設定(User Account Settings)
[鐵人賽Day17]DotNetNuke使用篇–第三方帳號驗證
[鐵人賽Day18]DotNetNuke使用篇–管理使用者帳號、角色
[鐵人賽Day19]DotNetNuke使用篇–建立子網站
[鐵人賽Day20]DotNetNuke使用篇–內容多語系化
[鐵人賽Day21]DotNetNuke使用篇–Host設定介紹
[鐵人賽Day22]DotNetNuke使用篇–網站設定(Site Settings)介紹
[鐵人賽Day23]翻譯DotNetNuke–使用語言編輯器
[鐵人賽Day24]DotNetNuke的網頁選單(Menu)翻譯
[鐵人賽Day25]設定DotNetNuke的Email範本
[鐵人賽Day26]DotNetNuke寄送郵件功能介紹
[鐵人賽Day27]查看DotNetNuke的執行記錄–事件檢視器(Log Viewer)介紹
[鐵人賽Day28]維護DotNetNuke的清單列表(List)–在Profile中可以下拉選擇台灣的縣市
[鐵人賽Day29]DotNetNuke樣式設計–Skin和Container簡介
[鐵人賽Day30]尋找更多的DotNetNuke擴充套件(Module、Skin)


尚未有邦友留言

立即登入留言