趙建兵
校園網站是學校信息化建設的重要內容之一,是學校形象展示、信息發布、業務交流、師生溝通的重要陣地。但網站開發和維護工作量大,也存在一定的技術難度,尋求一套簡單可行的網站建設方法對于中小學校來說具有重要的意義。
CMS(內容管理系統)是現在比較流行的一種網站建設模式。它通過在線網頁編輯器和數據庫來組織網頁信息,配以相應的支撐頁面來讀取顯示信息。在中小學校園網站建設中,可以使用CMS降低網站建設難度,簡化網站開發。
在線網頁編輯器是CMS不可缺少的組件,通常運行在網站后臺,用于添加新的網頁內容。本文介紹使用FCKeditor進行校園網站開發的方法,配合ASP編制一套簡單的內容管理系統。FCKeditor是一款優秀的在線網頁編輯器,支持多種網絡編程語言,并支持多種瀏覽器。
一、系統設計
系統分前臺頁面和后臺管理兩部分。前臺面頁包括網站首頁、分類目錄頁和內容顯示頁。后臺管理包括內容添加頁和網頁數據庫,以及用戶身份驗證。用戶身份驗證是后臺管理的關鍵步驟,一般的方法是收集用戶輸入的用戶名和密碼,然后和數據庫中存儲的用戶信息比較,如果是合法用戶就將用戶身份存到一個Session變量中,然后在有權限限制的網頁中驗證這個變量,否則就退出系統。本文將重點說明FCKeditor和相關網頁以及數據庫的配合使用。
核心方法如下:在內容添加頁中使用FCKe ditor創建網頁內容,網頁對應的HTML代碼存放到數據庫表的備注字段中。將引用的圖片、Flash動畫、視頻等媒體文件存放到網站的素材文件夾中。瀏覽網頁時,從數據庫表的備注字段讀取HTML代碼并傳遞給瀏覽器進行顯示。數據庫表設計如圖:
實際工作中,可以根據需要添加其他網頁屬性。例如:學校工作類別眾多,可以按照信息來源不同將網頁分類,如教研信息、教學信息、教務信息等,由此可以添加一個A_type字段。在IIS中創建一個站點,將包含此表的數據庫放在站點的根目錄下,本例中存放網頁的表名為article。
二、FCKeditor的安裝與配置
1.下載安裝包
到FCKeditor的官方網站www.FCKeditor.net下載最新版本。本文以FCKeditor 2.6.4為例進行介紹。
2.安裝
將文件解壓后得到FCKeditor文件夾,把它放到站點根目錄下。
3.基本配置
編輯FCKeditor/fckconfig.js文件,找到下列選項并作相應設置。在FCKConfig.FontNames里增加中文字體宋體、楷體等。在FCKConfig.FontSizes里增加字體大小9pt、10pt等。
4.文件上傳配置
使用FCKeditor可以實現在編輯網頁時隨時上傳素材文件,但上傳功能默認是關閉的,需要手工打開,按以下步驟進行。
(1)打開FCKeditor/editor/filemanager/connectors/asp文件夾,編輯config.asp文件,找到下列選項并作相應設置:
ConfigIsEnabled = True //設置上傳功能打開
ConfigUserFilesPath = "/userfiles/"http://設置上傳目錄為網站根目錄下的userfiles目錄,即素材文件夾
上傳的素材文件一般包括鏈接到的文件(如RAR)、圖片、Flash、視頻等。我們可以將這些文件存放到以當前日期為名稱的子文件夾中,以便查找。找到下面的語句:
ConfigQuickUploadPath.Add"File", ConfigUserFilesPath
在語句的末尾加上這個字符串"&"file/"& date"。其中file表示類型文件夾,date表示當前日期。這樣就完成了鏈接文件的存放設置。以同樣的方法找到"Image"、"Flash"、"Media"對應的語句并添加相應的字符串。
(2)編輯FCKeditor/fckconfig.js文件,找到下列選項并作相應設置:
var _FileBrowserLanguage=asp;//將內置文件瀏覽器的網絡語言設為ASP;
var _QuickUploadLanguage=asp;//將快速上傳的網絡語言設為ASP;
(3)快速上傳中文文件名亂碼處理
使用FCKeditor上傳中文名稱的文件,對話框中的文件名會出現亂碼,可以通過下面的方法解決:
打開FCKeditor/editor/filemanager/connectors/asp文件夾,編輯io.asp文件,找到SendUploadResults函數,在Response.Clear后增加兩行:
Response.CodePage=65001
Response.Charset="UTF-8"
我們在做網站時要盡量避免使用中文作為文件和文件夾的名稱。
5.添加插入視頻功能
FCKeditor沒有提供在網頁中插入視頻的功能,可以使用一個插件來解決這個問題。
(1)首先下載插件(hljy.zjkedu.cn/media.rar),解壓后得到Media文件夾。將其移動到FCKeditor/editor/plugins文件中。注意文件夾名“Media”的首字母M要大寫,否則,將來在FCKeditor中調用時會出現“未知名工具欄項目”錯誤。
(2)編輯 FCKeditor/fckconfig.js文件,找到這一句:
FCKConfig.PluginsPath = FCKConfig.BasePath+plugins/;
在它的下面添加這條語句:
FCKConfig.Plugins.Add(Media,zh-cn );
再找到FCKConfig.ToolbarSets["Default"] =[……];這個代碼段,在其中的元素Flash的后面,添加Media。
在文件后部找到下面的代碼:
FCKConfig.FlashBrowser = true ;
從這一句開始的下面四句作用是啟用插入Flash媒體對話中瀏覽服務器的功能。復制這四行語句,并在后面的空行上粘貼,然后把粘貼內容中所有的“Flash”字符替換為“Media”,這樣就啟動了插入Media對話框中瀏覽服務器的功能了。
再找到FCKConfig.FlashUpload = true ; 從這一句開始的下面四句作用是啟用Flash文件的上傳功能。復制這四行語句,并在后面的空行上粘貼,然后把粘貼內容中所有的“Flash”字符替換為“Media”,這樣就啟動了Media文件的上傳功能了。修改第三行中的允許上傳文件類型擴展名,去掉swf,添加wmv、rm、rmvb、mp3等格式。
(3)打開FCKeditor/editor/plugins/Media/js文件夾,編輯fck_media_inc.asp文件,找到字符串clsid:6BF52A52-394A-11D3-B153-00C04F79FAA6,替換為clsid:22d6f312-b0f6-11d0-94ab-0080c74c7e95。
這樣,插入的Media插件就可以在FCKeditor中正常調用了。在網頁中插入視頻時,建議使用wmv格式,其他格式的視頻需要在客戶端瀏覽器安裝相應播放插件才能正常觀看。
三、創建ASP頁面
FCKeditor配置完成以后,需要在后臺添加的內容頁中調用,才能實現網頁在線編輯。編輯完成后,網頁要保存到數據庫中。瀏覽網頁時,再從數據庫中讀取出來。下面簡述各頁面的設計。
1.后臺管理頁面
(1)集成FCKeditor編輯器到后臺內容添加頁面
在網站根目錄下利用Dreamweaver新建一個名稱為Admin.asp的網頁,進入代碼模式,在<head>標記前添加下面的語句:
<!--#include file="FCKeditor/fckeditor.asp" -->
在網頁中插入一個表單,再放置一個名稱為title的文本框,用于填寫網頁標題。在表單域代碼中插入以下代碼:
<%
Dim oFCKeditor
Set oFCKeditor = New FCKeditor
oFCKeditor.BasePath ="/fckeditor/"
oFCKeditor.height=800
oFCKeditor.Value= ""
oFCKeditor.Create "details"
%>
以上代碼在Admin網頁中創建一個名為details的FCKeditor編輯器,它在網頁中以表單元素的形式存在。編輯器中的工具按鈕包含了網頁編輯的各個功能,可以編輯所需要的各種網頁,發布信息。例如,從Word粘貼的功能可以把教師用Word編輯的優秀教案直接粘貼到網頁中發布。
最后,在表單中插入一個提交按鈕,命名為保存,并設置表單通過post方法提交到網頁Add.asp。
(2)將編輯的網頁添加到數據庫
新建網頁Add.asp,添加以下代碼:
<%
創建數據庫連接conn并打開,代碼略
使用addnew方法將表單數據存入數據庫
set rs=server.CreateObject("adodb.recordset")
rs.open "article",conn,1,3
rs.addnew()
rs("A_title")=Server.HTMLEncode(request.form("title"))
rs("A_details")= request.form("details")
rs.update
關閉記錄集和數據庫連接,代碼略
%>
2.前臺瀏覽頁面
(1)網站首頁顯示網頁標題并創建鏈接列表
新建網頁Index.asp,添加以下代碼:
<%
創建數據庫連接conn和記錄集rs并打開,代碼略
循環讀取網頁編號和標題并生成鏈接
while not rs.eof
response.write rs("A_ID") & "."
response.write "<a href='show.asp?A_id="&rs("A_ID")&"'>"&rs("A_title") & "</a><br>"
rs.movenext
wend
關閉數據庫記錄集和連接,代碼略
%>
(2)創建內容顯示頁面
新建網頁Show.asp,添加以下代碼:
<%
創建數據庫連接conn并打開,創建記錄集rs,代碼略
讀取網頁內容并顯示
sql="select * from article where A_ID=" & request.querystring("A_id")
rs.open sql,conn,1,1
response.write "<center>" & rs("A_title") &"</center><hr>"
response.write rs("A_details")
關閉數據庫記錄集和連接,代碼略
%>
以上為系統實現的關鍵頁面。在實際的校園網站建設中,網頁一般要根據需要分類,并在首頁顯示分類導航條,單擊導航鏈接后進入相應類型的網頁目錄。分類網頁目錄的創建和首頁中創建鏈接列表的方法類似,不同的是需要在查詢中加入類型限制。
這樣,我們就利用FCKeditor創建了一個簡單的CMS。如果再把內容豐富一下,加上欄目設置和權限管理,就構成一個完整的校園網站信息發布平臺了。教學資源庫、教師Blog都可以參照這個方法來創建。
(作者單位:河北懷來縣教研室)