您现在的位置是：芭奇站群管理系统 > 优化技巧 > -> 免费网页编辑器下载html编辑器插件

免费网页编辑器下载html编辑器插件

时间：2010-05-14 22:50

　　1.可视化html编辑器tinymce

　　下载地址：abcdtinymce.moxiecode.com/download.php

　　2.kindeditor3.4-所见即所得html编辑器

　　下载地址：abcdkindsoft.net/

　　3.webeditor

　　下载地址：abcddragongod.com/

　　4.nicedit简单，易用，轻量，外观漂亮。

　　下载地址：abcdnicedit.com/

　　5.kupu

　　下载地址：abcdkupu.oscom.org/download/

　　基本安装是非常简单的。你只需要到abcdjs025.blog.sohu.com/下载压缩包，然后解压到网站的一个可访问的目录下就行了。它将创建kupu/目录，其下包含一些文件和子目录。你不需要进行make或者其他类似的操作。但我建议你先不要看doc/子目录下的内容。

　　在浏览器中输入<yourpath>/kupu/common/kupu.html（<yourpath>指kupu所在的路径，你需要补充完整这个url）就可以看到编辑器界面了。你也可以访问我的kupu编辑器测试页面。

　　该页面由三部分组成：工具栏和左右面板。顶部的工具栏包含了编辑器标准功能按钮。右侧面板由一些块（block）组成，每个块为相应功能提供额外信息。左侧面板就是你正在编辑的文档。在本示例中，左侧面板预装入了简要介绍kupu设计理念的文档。

　　在左侧面板内某处单击然后就可以开始输入。如果你使用firefox浏览器，而上述操作没有反应，那么请按f7键。按f7可以启动“插入浏览”（caretbrowsing），修从而复这个问题。这个界面有些怪异，但还是挺直观的。选择一些文本然后改变其颜色和格式。创建一些链接。插入源为某url的图片并改变其大小。最好再插入一个表格并增删其行列。这个演示程序并不支持保存操作，它将触发一个错误。我将在下文介绍如何修复这个错误。

　　kupu目前的版本也许不能满足你对它作为wysiwyg编辑器的全部期望。例如，你无法改变字体，只能插入web上的图片。还有一些功能是不正常的，至少在我的机器上如此。但其兼容性对多数应用程序来说已经绰绰有余了。若你不想涉及插件或者javaapplet，kupu绝对是一个让人振奋的成就。它仅仅是一个包含了javascript的网页。

　　kupu的实际价值在于它可以嵌入到其他应用程序中。嵌入方式有两种。最简单的用法是使用post方法将数据作为一个cgi脚本参数值发送到服务器。另一个用法稍有点复杂，但它是kupu小组的选择，那就是使用put方法和一个简单的cgi脚本将数据发送到web站点的一个文件中。

　　使用kupu

　　嵌入kupu利用其功能是以在页面中包含许多javascript文件为代价的。即使像common/kupu.html这样的基本页面中也包含了让人望而生畏的代码。更要命的是，包含文件的链接都是相对的，这会让你很头疼，若你想在kupu源程序结构上花些时间的话。你其实不想碰这些代码，但是你需要建立自定义内容和kupu之间的关联并让一切正常运行。幸运的是，你可以使用<base>标记，这是一个简单办法。

　　将kupu发布版放到你的站点树（webtree）的某子目录下。然后在站点树的其他地方为你的网页建立一个目录。将模板页（kupu/common/kupu.htmlorkupu/common/kupuform.html）复制过去，并在页面的<head>段中添加<base>标记，指向发布版的common目录。例如：

　　<head>

　　<basehref="abcdcraic.com/oreilly/kupu/kupu/common/">

　　</head>

　　浏览器将在所有相对链接前附加该url。注意，它必须是一个包括主机名的完整url路径；这个规则适用于该页面中的所有相对url，而不仅是kupu用到的。在插入图片、样式表、或链向本站其他页面时，务必注意<base>标记的影响。

　　以put方法使用kupu

　　整合kupu的第一种方法是使用put方法上传文件到web服务器。put虽然也是http协议的一种方法，但在知名度上无法与get和post相提并论。put允许上传完整的文件，然后将其置入站点树中。当然，你也可以使用html表单和cgi脚本来完成同样任务，但put的目的就是为了简化这种过程。《publishingpageswithput》一文提供了一些背景知识，该文发表于1997年。

　　也许大家很少使用put方法的主要原因就是其固有的不安全性了。put方法有允许任何人提交任何文件到服务器的安全隐患。你需要仔细配置服务器，避开任何潜在的安全漏洞。任何一个小小的失误都可能给攻击者创造莫大机会。相反，你可以考虑使用post方法打造一个封闭、安全的系统，通过cgi脚本与之交互。这将要求更多编程工作，但其风险更易于管理。

　　一个put请求将发送两行头信息，然后才是请求内容。content_length告诉服务器发送的数据长度。path_translated指定数据写入哪个文件。你可以将其视为浏览器从服务器获取一个页面的逆过程。apachehttpd配置默认接受put请求，但你还需要配置一个cgi脚本来处理接收的文件。下面是cgi脚本配置示例，你只需要根据你的情况替换掉脚本名就可以了：

　　scriptput/cgi-bin/kupu/handle_put.cgi

　　以下是一个简单的cgi脚本实现。注意，该脚本中没有考虑安全检查。任何人都可以向运行了该脚本的站点上传文件。在公网站点上安装该脚本时务必添加安全限制。切记！（本示例并非我的站点上运行的应用程序）

　　#!/usr/bin/perl-w

　　#handle_put.cgi

　　#basicputhandlingroutinewithnosecurity!

　　if($env{request_method}neput){

　　errormsg("requestmethodisnotput");

　　}

　　my$filename=$env{path_translated};

　　if(not$filename){

　　errormsg("path_translatedwasempty");

　　}

　　my$length=$env{content_length};

　　if(not$length){

　　errormsg("content_lengthwasempty");

　　}

　　#addsecuritycheckshere!limitaccesstocertain

　　#directoriesandlimitsizeand/ortypeoffile.e.g.

　　if($length>100000){

　　errormsg("content_lengthistoolarge");

　　}

　　#readintheuploadeddata

　　my$content=;

　　my$nread=read(stdin,$content,$length);

　　#maketheoutputmorereadablebyaddingnewlines

　　$content=~s/\>\</\>\n\</g>$filename"errormsg("unabletoopen$filename");

　　printout$content;

　　closeout;

　　#the204codesignalsthetransferwasokbutdoesnot

　　#updatethecurrentpage-soyoustayintheeditor

　　printqq[status:204\n];

　　printqq[content-type:text/html\n\n];

　　print$content;

　　exit;

　　suberrormsg{

　　my$msg=shift;

　　printqq[content-type:text/html\n\n];

　　printqq[<html><head><title>error</title></head>\n];

　　printqq[<body>\nerror:$msg<br>\n</body></html>\n];

　　exit;

　　}

　　ok，服务器已经就绪。现在可以设置kupu使用put了。你不需要在网页中指定cgi脚本，因为apache配置文件中已经预先做好了配置。你所需要做的只是在页面中指定服务器上用于写入数据的文件。将kupu/common/kupu.html复制到你的目录，按照上文的说明添加<base>标记，这样你就可以从发布版目录中装入javascript库了。

　　看一眼这个页面的源代码。300多行看了就晕，要命的是其中不乏非html内容。幸运的是，现在只需要其中两行，一行在在头部，另一行在尾部。现在并不需要触动其他内容。在kupu.html的源代码尾部指定页面装入编辑器。这里，我使用了一个空白页面（kupublank.html）。

　　<iframeid="kupu-editor"frameborder="0"src="kupublank.html"scrolling="auto">

　　接着指定服务器上写入数据的文件。查找<kupuconfig>，从上往下数大约30行左右就是：

　　<dst>abcdcraic.com/oreilly/kupu/no_such_file.html</dst>

　　将<dst>标记中的内容替换为目标文件的url。web服务器必须拥有该目录的写权限。注意，你指定的是单个文件。在这些示例中，你无法在运行时定义文件名。

　　浏览器装入刚配置的编辑器后，输入一些文本，编辑其格式。若想保存文件，只需要单击kupu工具栏上的磁盘图标。

　　在html表单中使用kupu

　　第二种方法是使用表单包装kupu代码。这需要更多的努力，因为你需要一个cgi脚本来处理数据。不过，相对put技术来说，它提供更多的数据控制。put只是简单地对编辑器中的东西作了一下镜像。

　　下面介绍一个html表单示例（kupu/common/kupuform.html）。该页在浏览器中的显示结果和上一个示例（kupu.html）的一样。页面源代码非常相似，但关键之处略有不同。从上到下数，在第20行左右，你可以找到一个<form>标记：

　　<formaction="abcddebris.demon.nl/printpost"method="post">

　　这个url定义了处理上传文本的脚本。将它替换为你的脚本。从下往上数大约8行，你可以找到一个<iframe>标记：

　　<iframeid="kupu-editor"frameborder="0"

　　src="fulldoc.html"scrolling="auto">

　　src属性指定了启动编辑器时装载的文档。本例的装载文档是fulldoc.html。

　　若想使用这个表单，只需要改变这些行。首先，将kupuform.html复制到你的目录，并像上例一样添加一个<base>标记来访问javascript函数库。在<iframe>标记中指定一个空白文件kupublank.html，这样编辑器启动时就显示空白文档。

　　你需要在服务器上运行一个cgi脚本来处理提交的数据。下面是一个简单的脚本（kupu_echo.cgi），它读入表单传来的数据（该数据随kupu参数传递），然后直接将该数据返回给用户。kupu生成的html是没有换行的，这给查看源代码带来不便，所以示例脚本中在每个标记后面插入一个换行符。

　　#!/usr/bin/perl-w

　　#kupu_echo.cgi

　　usecgi;

　　my$cgi=cgi->new();

　　my$text=$cgi->param(kupu);

　　$text=~s/\>/\>\n/g;

　　print$cgi->header();

　　print$text;

　　将该脚本放到站点的cgi-bin/目录中，将赋予可执行权限：chmoda+xkupu_echo.cgi，然后将其url替换到<form>标记。这两个标记改变后应该和下面的类似：

　　<formaction="abcdcraic.com/cgi-bin/kupu/kupu_echo.cgi"method="post">

　　...

　　<iframeid="kupu-editor"frameborder="0"

　　src="kupublank.html"scrolling="auto">

　　在浏览器里打开kupuform.html，你会看到编辑器的左面板为空白。随便敲入一些文本，修改其格式。单击工具栏中的磁盘图标将编辑结果上传到cgi脚本。如果你想即刻获得满足，那么请访问我的站点上的演示页面。abcdcraic.com/oreilly/kupu/kupuform.html

　　这个过程并不是很麻烦。你只需要改变模板页面的两行代码，然后编写一个简单的cgi脚本。最重要的是，你连一行javascript都不需要触动。当然，这只是一个简单示例，但它帮助你度过了学习曲线的第一个阶段。

　　html编辑器下载：notepad++具有代码高亮显示的免费html编辑器并且支持多种格式文件编辑。tinymce下载可以在cms中作为html编辑器插件使用可视化（wysiwyg,所见即所得）。ckeditor下载功能和tinymce类似。

　　分享到搜狐微博

与免费网页编辑器下载html编辑器插件相关文章：
　　·站群系统下面我们就来谈谈几种免费又有效的推
　　·站群工具C、网站具有很强的对手
　　·如果你的店铺销售的是其他的类型的用品
　　·网店运营推广不可避免的市场分析站群系统
　　·哪个网站可以打广告？网站广告报价简单查询方
　　·卫浴企业如何做好网络营销站群软件

　　本文标题：免费网页编辑器下载html编辑器插件
　　本文地址：http://www.bakii.cn/seo/201005141330.html