第一步:將CKEditor,CKFinder下載好,并解壓于網(wǎng)站根目錄baixiang下。
第二步,在網(wǎng)站根目錄baixiang下建立test.html
在test.html中先引入CKEditor的JS文件和CKFinder的JS文件
<script type="text/javascript" src="ckeditor/ckeditor.js"></script> <script type="text/javascript" src="ckfinder/ckfinder.js"></script>
第三步加載編輯器:在test.html中加入
<textarea id="content" name="content" class="ckeditor">初始化內(nèi)容...</textarea> <script type="text/javascript"> if (typeof CKEDITOR == 'undefined') { document.write('加載CKEditor失敗'); } else { var editor = CKEDITOR.replace('content'); CKFinder.SetupCKEditor(editor, '../baixiang/ckfinder/'); //ckfinder總目錄的相對路徑.注意此處的寫法,(../根目錄(baixiang)/ ckfinder/) }
</script>
第四步配置CKEditor下的config.js文件:
下面的路徑都要帶上根目錄(baixiang);
config.filebrowserBrowseUrl = '/baixiang/ckfinder/ckfinder.html'; config.filebrowserImageBrowseUrl = '/baixiang/ckfinder/ckfinder.html?Type=Images'; config.filebrowserFlashBrowseUrl = '/baixiang/ckfinder/ckfinder.html?Type=Flash'; config.filebrowserUploadUrl = '/baixiang/ckfinder/core/connector/asp/connector.asp?command=QuickUpload &type=Files'; config.filebrowserImageUploadUrl = '/baixiang/ckfinder/core/connector/asp/connector.asp?command=QuickUpload &type=Images'; config.filebrowserFlashUploadUrl = '/baixiang/ckfinder/core/connector/asp/connector.asp?command=QuickUpload &type=Flash';
此代碼為啟用上傳圖片的功能
第五步修改ckeditor/plugins/image/dialogs/image.js 文件: // hidden: ture, 為原來的默認值,瀏覽按鈕為不顯示。改為 hidden:false, {type:'button',id:'browse',style:'display:inline-block;margin-top:10px;',align:'center',label:q.lang.common.browseServer,hidden:false,filebrowser:'info:txtUrl'}
第六步修改:/ckfinder/config.asp
(1)查找CheckAuthentication 修改CheckAuthentication = false為true '只適合本機測試,否則很危險 如果掛上互聯(lián)網(wǎng),還需檢測權(quán)限,以我的代碼為例 if Session("admin") <> true then CheckAuthentication = false else CheckAuthentication = true end if
(2)修改baseUrl的值,文件設(shè)置上傳的保存目錄,記得為這個目錄開寫權(quán)限
在根目錄下建立上傳圖片文件夾uploadfiles;
baseUrl = "/baixiang/uploadfiles/" ;說明,baseUrl設(shè)置時,也要帶上根目錄(baixiang);
(3)不用上傳組件的話,修改下面的信息;
Images.Add "component", "Auto" 改為 Images.Add "component", "none"
至此,結(jié)束。
|