CKeditor、CKFinder的安裝配置


CKEditor是不集成文件上傳與管理功能的,文件上傳管理功能被集成在CKFinder中,這是一個收費的商業軟件。

如需要文件上傳與管理功能建議使用FCKeditor或者手動破解CKFinder。

下面我說一下ckeditor的使用方法,有三種:

當前最新的.net版本為ckeditor_aspnet_3.6.6.2

ckeditor為4.5.8

方法一(添加控件的形式):

①將ckeditor_aspnet_3.6.6.2\bin\Debug路徑中的CKEditor.NET.dll添加到引用

(CKFinder一樣添加CKFinder.dll文件)

②將CKEditor.NET.dll文件粘貼到工具箱常規

③在網頁注冊程序集

1 <%@ Register Assembly="CKEditor.NET" Namespace="CKEditor.NET" TagPrefix="CKEditor" %>

 

直接拖動控件到網頁中就可以使用

使用ckfinder要寫后台代碼,與CKEditor綁定

1 protected void Page_Load(object sender, EventArgs e)  
2  {  
3      CKFinder.FileBrowser fileBrowser = new CKFinder.FileBrowser();  
4      fileBrowser.BasePath = "ckfinder";  //CKFinder路徑  
5      fileBrowser.SetupCKEditor(CKEditorControl1);  
6  }  

方法二(js加載)

①配置ckeditor的路徑,如果是ckeditor文件夾下的話可以不配置,默認路徑為ckeditor

1 CKEDITOR.editorConfig = function( config )  
2 {
3      basePath = '/js/ckeditor/';   //CKEditor路徑  
4  };  

②在網頁中引入js文件

1 <script src="/ckeditor/ckeditor.js" type="text/javascript"></script>  
2 <script src="/ckfinder/ckfinder.js" type="text/javascript"></script> 

③完成初始化

 1   <!--方法一-->
 2   <textarea id="content" name="content" class="ckeditor"><%=Request.Form["content"] %></textarea>  
 3   <script type="text/javascript">  
 4           CKFinder.setupCKEditor(null, '/ckfinder');    //綁定CKFinder到編輯器中
 5   
 6   </script>  
 7      
 8   <!--方法二-->  
 9   <textarea id="content" name="content"><%=Request.Form["content"] %></textarea>  
10   <script type="text/javascript">   
11       var editor = CKEDITOR.replace('content');   
12       CKFinder.setupCKEditor(editor, '/ckfinder');   
13   </script>

方法三(jQuery加載)

①引入js

1  <script src="/js/jquery/jquery-1.6.2.js" type="text/javascript"></script>  
2  <script src="/ckeditor/ckeditor.js" type="text/javascript"></script>  
3  <script src="/ckeditor/adapters/jquery.js" type="text/javascript"></script>  
4  <script src="/ckfinder/ckfinder.js" type="text/javascript"></script> 

 ②初始化

1 <textarea id="content" name="content"><%=Request.Form["content"] %></textarea>  
2 <script type="text/javascript">  
3     $(function() {  
4          $('#content').ckeditor();  
5                 CKFinder.setupCKEditor(null, '/ckfinder');  
6     });  
7  </script>  

最后刪除CKEditor多余文件:

可刪除的文件夾:samples(示例)、source(開源文件)、source(如不使用jQuery方法加載可刪除)

lang:languages.js、zh-cn.js、en.js這3個文件,其它全部刪除。

skins:存放皮膚文件,將不用的刪除,默認是moono。

提示:CKFinder是需要付錢的,可自行百度破解方法。個人支持正版。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM