CuteEditor使用手记

原创于 2011-03-16 17:04:00 发布 · 642 阅读

0 ·

本内容遵循CC 4.0 BY-SA版权协议

收录于

asp.net中的有些封装（方法）

本文详细介绍了CuteEditor富文本编辑器的安装配置步骤，包括文件拷贝、Web.config文件修改、常用属性设置等内容，帮助开发者快速上手。

1、拷贝文件

(1)将CuteEditor、Bin文件夹下的：

CuteEditor.dll

CuteEditor.lic（解密文件）

CuteEditor.ImageEditor.dll （5.0增加的EditorImage功能）

NetSpell.SpellChecker.dll（拼写检查功能）

拷贝到项目的Bin目录下。

注：（“.dic”为扩展名的文件是词典保存为纯文本文件的格式。将bin文件夹里的都拷到项目的bin目录下也可以）

(2)将CuteSoft_Client文件夹及文件拷贝到项目的相应目录。

注:FilesPath用来设置所对就的目录,如：

FilesPath="~/admin/CuteSoft_Client/CuteEditor/"

(3)把example.css文件拷贝到相应目录，并设置EditorWysiwygModeCss属性。如：EditorWysiwygModeCss="/admin/CuteSoft_Client/CuteEditor/themes/example.css

综合设置如下：

<CE:Editor ID="Editor1" runat="server" FilesPath="~/admin/CuteSoft_Client/CuteEditor/" EditorWysiwygModeCss="/admin/CuteSoft_Client/CuteEditor/themes/example.css"> </CE:Editor>

2、修改Web.config文件

</appSettings>

<system.web>//注本节代码在.net2.0下是否需要设置，本人未验证。

tagwriter=System.Web.UI.HtmlTextWriter

</browserCaps>

</system.web>

3、引用：

·<%@ Register Assembly="CuteEditor" Namespace="CuteEditor" TagPrefix="CE" %>

·<CE:Editor ID="ce1" runat="server" FilesPath="~/admin/CuteSoft_Client/CuteEditor/" EditorWysiwygModeCss="~/Admin/CuteSoft_Client/CuteEditor/Themes/example.css" ThemeType="Office2003_BlueTheme" >

</CE:Editor>

注：

可修改CuteSoft_Client/CuteEditor/Configuration/AutoConfigure文件夹下的文件，改便CuteEditor工具栏按钮的显示或排列。

可修改文件CuteSoft_Client/CuteEditor/Configuration/Shared/Common.config来添加字体。

使用这个控件是因为前些时间在做一个BLOG，同时看到博客园使用的这个文章编辑器很好，看了看设定，原来是CuteEditor，于是在网上下载了控件，开始配置，以下只是对控件配置作一下笔记。
一、直接把CuteSoft_Client文件夹放到网站根目录下，这个文件夹是放了控件图片之类数据。（在2.0下可能要把dialog文件夹里面的getfilethub.aspx删除）；
二、打开：CuteSoft_Client/CuteEditor/Configuration/Security，修改“Default.config”文件；
三、对Default.config进行常用属性设置：

<?xml version="1.0" encoding="utf-8" ?>
<configuration>
<security name="RestrictUploadedImageDimension">true</security>   //是否限制上传图象尺寸
<security name="OverWriteExistingUploadedFile">false</security>   //如果上传的文件已经存在，是否将其覆盖
<security name="AutoResizeUploadedImages">true</security>   //是否自动调整上传图象
<security name="MaxImageWidth">1024</security>   //上传图象的最大宽度
<security name="MaxImageHeight">768</security>   //上传图象的最小宽度
<security name="MaxImageSize">1000</security>   //上传图象文件的最大值
<security name="MaxMediaSize">100</security>   //上传媒体文件的最大值
<security name="MaxFlashSize">100</security>   //上传Flash文件的最大值
<security name="MaxDocumentSize">10000</security>   //文档最大值
<security name="MaxTemplateSize">1000</security>   //模板最大值
<security name="ImageGalleryPath">~/uploads</security>   //图象文件上传路径
<security name="MediaGalleryPath">~/uploads</security>   //媒体文件上传路径
<security name="FlashGalleryPath">~/uploads</security>   //Flash文件上传路径
<security name="TemplateGalleryPath">~/templates</security>   //模板路径
<security name="FilesGalleryPath">~/uploads</security>   //文件库路径
<security name="MaxImageFolderSize">102400</security>   //图象文件夹最大值
<security name="MaxMediaFolderSize">102400</security>   //媒体文件夹最大值
<security name="MaxFlashFolderSize">102400</security>   //Flash文件夹最大值
<security name="MaxDocumentFolderSize">102400</security>   //文档文件夹最大值
<security name="MaxTemplateFolderSize">102400</security>   //模板文件夹最大值
<security name="ThumbnailWidth">80</security>   //最小宽度
<security name="ThumbnailHeight">80</security>   //最小高度
<security name="ThumbnailColumns">5</security>   //最小列数
<security name="ThumbnailRows">3</security>   //最小行数
<security name="AllowUpload">true</security>   //是否允许上传
<security name="AllowModify">true</security>   //是否允许修改
<security name="AllowRename">true</security>   //是否允许重命名
<security name="AllowDelete">true</security>   //是否允许删除
<security name="AllowCopy">true</security>   //是否允许复制
<security name="AllowMove">true</security>    //是否允许移动
<security name="AllowCreateFolder">true</security>   //是否允许创建文件夹
<security name="AllowDeleteFolder">true</security>   //是否允许删除文件夹
<security name="ImageFilters">   //这里过滤(设置)图象文件格式
   <item>.jpg</item>
   <item>.jpeg</item>
   <item>.gif</item>
   <item>.png</item>
</security>
<security name="MediaFilters">   //这里过滤(设置)媒体文件格式
   <item>.avi</item>
   <item>.mpg</item>
   <item>.mpeg</item>
   <item>.mp3</item>
</security>
<security name="DocumentFilters">   //这里过滤(设置)文档文件格式
   <item>.txt</item>
   <item>.doc</item>
   <item>.pdf</item>
   <item>.zip</item>
   <item>.rar</item>
   <item>.avi</item>
   <item>.mpg</item>
   <item>.mpeg</item>
   <item>.swf</item>
   <item>.jpg</item>
   <item>.jpeg</item>
   <item>.gif</item>
   <item>.png</item>
   <item>.htm</item>
</security>
</configuration>
四、导入CuteEditor.dll；NetSpell.SpellChecker.dll库文件；

五、在根目录下建立Uploads的文件夹作为上传图片及附件的根目录，建立templates作为模板文件夹，用处不大，不过不建会报错。

六、example.css放在站点根目录下，它指定了编辑器的样式。

七、控件的调用代码：
<%@ Register TagPrefix="CE" Namespace="CuteEditor" Assembly="CuteEditor" %>

<CE:EDITOR id="Editor1" runat="server" Width="550px" EditorWysiwygModeCss="../example.css"></CE:EDITOR>

可修改文件CuteSoft_Client//CuteEditor//Configuration//Shared//Common.config来添加字体。

以上内容均来自网上。。。。。。。。。。。。。。

我的小结：
一、CuteSoft_Client/CuteEditor/Dialogs/InsertEmotion.htm文件可按页面的格式添加表情，
二、CuteSoft_Client/CuteEditor/Configuration/Shared/Common.config 可配置以下内容：
1、代码片断：找到文件中的Codes节点，添加一个item节点，按它的格式，添加value和 html
2、连接：找到文件中LinkTree节点，不难看出它是连接中那个树形结构的配置，item中可以包含item，可按它的格式写出更多。
  如：
   <item text="deng" value="http://pointdeng.cnblogs.com/">
               <html><![CDATA[hi:pointdeng]]></html>
           </item>
3、Images：找到文件中Images节点，添加相应item节点，
三、在一个网站中，肯定会有很多的人，那么这些人自己上传的文件怎么管理呢？经过查找之后发现原来控件可以设定相关文件的路径的，
  Editor1.AutoConfigure枚举设定风格
  Editor1.SetSecurityImageGalleryPath(path);图片文件路径
  Editor1.SetSecurityMediaGalleryPath(path);多媒体文件路径
        Editor1.SetSecurityGalleryPath(path);没明白这是什么，不过都设一样吧。
        Editor1.SetSecurityFilesGalleryPath(path);可下载文件路径
           这里的path我是按用户名建不同的文件夹的，也许还有更好的办法/
    还有很多的方法，如Editor1.MaxHTMLLength可以限定输入的长度等，，，，，