CuteEditor 使用详解

CuteEditor是一款功能非常强大,支持图片上传、文件下载和word类似的文字编辑器。对于新闻发布系统和博客之类的系统,是非常的方便的。

 

 

那要把它要在asp.net中,有哪些步骤呢?

 

 

一、CuteEditor的配置

     

1、将以下文件考贝到你站点根目录下的bin内(这些在CuteEditor6.0/bin下都可以找到)

      CuteEditor.dll,

      CuteEditor.ImageEditor.dll(6.0增加的EditorImage功能),

      CuteEditor.lic(解密文件),

      NetSpell.SpellChecker.dll(拼写检查功能)

      注:(“.dic”为扩展名的文件是词典保存为纯文本文件的格式。将CuteEditor6.0/bin文件夹里的

            都拷到站点根目录下的bin内也可以)

 

2、将CuteSoft_Client文件夹拷贝到项目的根目录

      CuteSoft_Client包含CuteEditor文件夹和example.css,放了控件图片,文件之类的数据example.css

      它指定了编辑器的样式。(在2.0下可能要把dialog文件夹里面的getfilethub.aspx删除)

      注:FilesPath用来设置所对应的目录,如:FilesPath="~/admin/CuteSoft_Client/CuteEditor/"

     (css可以放在根目录下,只是调用的路径不同而已)

 

3、在根目录下建立Uploads的文件夹作为上传图片及附件的根目录

 

4、将CuteEditor.dll添加到工具箱

   先在工具箱空白处右击选择“添加选择项”,给选项卡添加一外名称为:CuteEditor。再在该选项卡

   中右击,选择“选择项 ”,在弹出的对话框的“.NET Frameword组件”标签中选择要添加的DLL文件

   即可。

 

5、CuteEditor属性设置(假设当前页在根目录下)

   1)AutoConfigure设为simple,即选择最简单的界面显示方式

   2)EditorWysiwygModecss设为:CuteSoft_Client/example.cs,需要把example.css文件放到该目录下。

   3)FilesPath设为:CuteSoft_Client/CuteEditor,设置CuteEditor目录的路径

     

6、控件的调用代码如下:

   <%@ Register TagPrefix="CE" Namespace="CuteEditor" Assembly="CuteEditor" %> 如果是按照第4步

   从工具箱中拖放到页面的话,则此代码会自动生成,不需要要手动添加。

  <CE:EDITOR id="Editor1" runat="server" Width="700px"

      FilesPath="~/CuteSoft_Client/CuteEditor/" EditorWysiwygModeCss="../example.css"

      ThemeType="Office2003_BlueTheme">

 </CE:EDITOR>

 

二、基本属性:

      EditorWysiwygModeCss :设置样式

      ThemeType :设置风格

      AutoConfigure :选择功能是简单还是复杂的

      Text :设置加载时候默认内容

      MaxHTMLLength :设置最大长度

      BreakElement :默认“回车”产生什么HTML

      URLType :没发现有什么区别

      ResizeMode :自动长度(长度设置的几中形式)

      ReadOnly :是否为只读

      CustomCulture :设置语言类型 china 为zh-cn

      EditCompleteDocument :设置是否完整的HTML页面代码(也就是说是不是包括html头)

      AllowPasteHtml :是否允许粘帖HTML代码

      EnableContextMenu :在文本里是否显示右键菜单

 

三、CuteEditor文件夹里的配置

      1)控制工具拦显示:在CuteSoft_Client/CuteEditor/Configuration/AutoConfigure 里设置

      2)控制右键显示:CuteSoft_Client/CuteEditor/Configuration/ContextMenuMode里设置

      3)设置权限:CuteSoft_Client/CuteEditor/Configuration/Security里设置

       例如要设置各种组件的大小等属性限制,如控制上传文件的大小等,可在

       CuteSoft_Client/CuteEditor/Configuration/Security修改“Security”文件夹中的

      “Default.config”文件即可

      ==========================

      <?xml version="1.0" encoding="utf-8" ?>

      <configuration>

      <security name="RestrictUploadedImageDimension">true</security>   //是否限制上传图象尺寸

      <security name="OverWriteExistingUploadedFile">false</security>   //如果上传的文件已经存

                                                                         
在,是否将其覆盖

      <security name="UseTimeStampRenameUploadedFiles">true</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> <!-- this is rename too -->   //是否允许移动

      <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>

      ========================

      4)设置工具拦按钮具体功能:CuteSoft_Client/CuteEditor/Configuration/Shared 里设置

      5)设置工具拦按钮具体功能:CuteSoft_Client/CuteEditor/Configuration/Shared 里设置

      6)设置语言:CuteSoft_Client/CuteEditor/Configuration/Languages里设置

      7)添加字体:CuteSoft_Client/CuteEditor/Configuration/Shared/Common.config里设置

      感觉 CuteEditor 每处都可以改变,因为它整体思路都是用摸板,具体体现形式写在配置文件里面。

      用户修改配置文件或是它提供的属性就可以实现自己的功能!

 

四、CuteEditor的服务器端控制

     

1)设置编辑器的默认文本:

   ①Editor1.Text = "Default Text";             
//服务器端方法

   ②var editor = document.getElementByIdx_x('<%=Editor1.ClientID %>'); //JavaScript方法

    var editorText = editor.getHTML();

     

2)修改文件的上传目录:Editor1.SetSecurityGalleryPath("~/uploads/jpg");

   修改上传文件的总大小(以Flash为例):Editor1.SetSecurityMaxFlashFolderSize(1000);

   修改单个上传文件的大小(以Flash为例):Editor1.SetSecurityMaxFlashSize(kb);   //默认KB为单位

     

3)多用户文件夹

  由于上传的文件统一被放置到uploads文件夹中,可以通过程序控制为每个用户建立一个上传的文件夹。

  代码如下:

            using System.IO;

            string username = Session["username"].ToString() ;

            fullPath = Server.MapPath("uploads\") + username;

            if (!Directory.Exists(fullPath))

            {

                  Directory.CreateDirectory(fullPath);

            }

            Editor1.SetSecurityGalleryPath("~/uploads/" + username);

 

 

 

CuteEditor 编辑器添加中文字体

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

主要注意的地方是该文件是用XML编码

<item text="FangSong_GB2312" html="&lt;font size=3 face='FangSong_GB2312'&gt;仿宋

  &lt;/font&gt;"> FangSong_GB2312</item>

 <item text="KaiTi_GB2312" html="&lt;font size=3 face='KaiTi_GB2312'&gt;楷体

 _GB2312&lt;/font&gt;"> KaiTi_GB2312</item>

要在CuteEditor中显示中文字体,需要将中文字体名称进行“国际化”,即将汉字字体名称改为英文名称,

如将“宋体”改为“Simsun",“黑体”改为"Simhei"等,下面是部分字体对照列表:

English Name    Localized Name  

SimSun                宋体  

SimHei                黑体  

FangSong_GB2312       仿宋_GB2312  

KaiTi_GB2312          楷体_GB2312  

YouYuan               幼圆  

STSong                华文宋体  

STZhongsong           华文中宋  

STKaiti               华文楷体  

STFangsong            华文仿宋  

STXihei               华文细黑  

STLiti                华文隶书  

STXingkai             华文行楷  

STXinwei              华文新魏  

STHupo                华文琥珀  

STCaiyun              华文彩云  

FZYaoTi               方正姚体简体  

FZShuTi               方正舒体简体  

NSimSun               新宋体  

LiSu                  隶书

 

时间: 2024-10-03 13:21:34

CuteEditor 使用详解的相关文章

详解Python中的type()方法的使用

  这篇文章主要介绍了详解Python中的type()方法的使用,是Python入门中的基础知识,需要的朋友可以参考下 type()方法返回传递变量的类型.如果传递变量是字典那么它将返回一个字典类型. 语法 以下是type()方法的语法: ? 1 type(dict) 参数 dict -- 这是字典 返回值 此方法返回传递变量的类型. 例子 下面的例子显示type()方法的使用 ? 1 2 3 4 #!/usr/bin/python   dict = {'Name': 'Zara', 'Age'

【转】java枚举使用详解

在实际编程中,往往存在着这样的"数据集",它们的数值在程序中是稳定的,而且"数据集"中的元素是有限的. 例如星期一到星期日七个数据元素组成了一周的"数据集",春夏秋冬四个数据元素组成了四季的"数据集". 在Java中如何更好的使用这些"数据集"呢?因此枚举便派上了用场,以下代码详细介绍了枚举的用法. Java代码   package com.ljq.test;      /**   * 枚举用法详解   *

状态模式(state pattern) 详解

状态模式(state pattern): 允许对象在内部状态改变时改变它的行为, 对象看起来好像修改了它的类. 建立Context类, 包含多个具体状态(concrete state)类的组合, 根据状态的不同调用具体的方法, state.handle(), 包含set\get方法改变状态. 状态接口(state interface), 包含抽象方法handle(), 具体状态类(concrete state)继承(implement)状态类(state), 实现handle()方法; 具体方法

kafka详解一、Kafka简介

背景:      当今社会各种应用系统诸如商业.社交.搜索.浏览等像信息工厂一样不断的生产出各种信息,在大数据时代,我们面临如下几个挑战: 如何收集这些巨大的信息 如何分析它        如何及时做到如上两点      以上几个挑战形成了一个业务需求模型,即生产者生产(produce)各种信息,消费者消费(consume)(处理分析)这些信息,而在生产者与消费者之间,需要一个沟通两者的桥梁-消息系统.      从一个微观层面来说,这种需求也可理解为不同的系统之间如何传递消息. Kafka诞生

Cocos2d-x win7 + vs2010 配置图文详解

Cocos2d-x win7 + vs2010 配置图文详解(亲测)   下载最新版的cocos2d-x.打开浏览器,输入cocos2d-x.org,然后选择Download,本教程写作时最新版本为cocos2d-1.01-x-0.9.1,具体下载位置如下图: 下载完之后,解压到当前文件夹.我把下载的程序放在F盘根目录,解压完毕之后,双击打开文件夹,看看里面有什么东西,红圈部分就是我们要安装使用的文件: 接下来,我们正式安装cocos2d-x到win7中去. 首先,双击上图中的cocos2d-w

ip-《TCP/IP 详解卷一》中90页中讲到,“由于子网号不相同,代理ARP不能使用”,这怎么理解?

问题描述 <TCP/IP 详解卷一>中90页中讲到,"由于子网号不相同,代理ARP不能使用",这怎么理解? <TCP/IP 详解卷一>中90页中讲到,"由于子网号不相同,代理ARP不能使用",这怎么理解? 解决方案 ARP主要用在一个子网中,用MAC地址来通信.数据链路层 不同子网,需要通过三层路由 解决方案二: 比如 N1 <-> GW <-> N2,N1和N2是同一个子网,GW上开启arp代理的效果是,N1和N2上

JS表格组件神器bootstrap table详解(基础版)_javascript技巧

一.Bootstrap Table的引入 关于Bootstrap Table的引入,一般来说还是两种方法: 1.直接下载源码,添加到项目里面来. 由于Bootstrap Table是Bootstrap的一个组件,所以它是依赖Bootstrap的,我们首先需要添加Bootstrap的引用. 2.使用我们神奇的Nuget 打开Nuget,搜索这两个包 Bootstrap已经是最新的3.3.5了,我们直接安装即可. 而Bootstrap Table的版本竟然是0.4,这也太坑爹了.所以博主建议Boot

网页文字该多大?文字字号详解

网页|详解 文字在网页上的应用: (只看小标题您就能知道这一部分要说什么了,为了避免罗嗦,在此文发布前决定把此处300余字删除,只保留了下面这一句.) 对于一个设计的好的网站来说,用户浏览时间最长的是文章正文. 中文网页文字的现状: 中文网页普遍使用12px和14px的宋体(simsun),这两种文字都可以加粗(font-weight: bold).这个规范似乎也成了网页设计师的基本 常识. 中国的网页设计师有这4种可供选择的文字表现方式,仅仅是4种,只有这4种,4种很小的文字.其中12px的宋

php-fpm配置详解

 这篇文章主要介绍了php-fpm配置详解,需要的朋友可以参考下 php5.3自带php-fpm   代码如下: /usr/local/php/etc/php-fpm.conf     pid = run/php-fpm.pid pid设置,默认在安装目录中的var/run/php-fpm.pid,建议开启   error_log = log/php-fpm.log 错误日志,默认在安装目录中的var/log/php-fpm.log   log_level = notice 错误级别. 可用级别