TinyMCE
TinyMCE是一个轻量级的基于浏览器的所见即所得编辑器,由JavaScript写成。它对IE6+和Firefox1.5+都有着非常良好的支持。功能方面虽然不能称得上是最强,但绝对能够满足大部分网站的需求,并且功能配置灵活简单。另一特点是加载速度非常快,如果你的服务器采用的脚本语言是PHP,那还可以进一步优化。最重要的是,TinyMCE是一个根据LGPL license发布的自由软件,你可以把它用于商业应用。
安装说明[ ]
TinyMCE的安装很简单,只需按照下面的说明。我们提供几个整合TinyMCE的例子,你应该先看看TinyMCE的广泛配置选项。
安装需求
除了浏览器兼容性TinyMCE没有直接的需求,当然,需要Javascript的支持;
后台不需要TinyMCE代码;
TinyMCE可以使用HTML表单的textarea作为工作区域,当提交表单时,你可以让你的系统操作textarea的内容,例如保存HTML代码到数据库或文件。前台也可以使用已经存在的内容初始化,以便可以进行更改。参考配置选项、一般配置、模式了解更多信息。
Windows下具体Apache配置
你可能会在Windows下安装时遇到如tinyMCE没有定义或属性列表后缺少“}”的错误。
问题是由默认的Apache选项EnableSendfile导致,你必须在httpd.conf文件中,去掉EnableSendfile选项前面的“#”,将该EnableSendfile关闭。
附注:TinyMCE没有定义或丢失也有可能是因为你没有在页面Header中指定正确的js路径。检测js路径正确之前,先改变Apache的设置。
下载
到下载地址1上下载。
解压
在Windows下你可以使用诸如winzip或其他类似软件解压,其他系统如Linux系统,只需使用tar命令就可以解压。你可以找到如何在linux下解压存档文件的例子。
你应该将TinyMCE解压到wwwroot目录或网站的根目录下。
使用shell解压的示例:
$ cd wwwroot $ gzip -d tinymce_1_44.tar.gz $ tar xvf tinymce_1_44.tar
解压后的文档结构:
/tinymce/ /tinymce/docs/ /tinymce/docs/zh_cn/ /tinymce/examples/ /tinymce/examples/zh_cn/ /tinymce/jscripts/ /tinymce/jscripts/tiny_mce/ /tinymce/jscripts/tiny_mce/langs/ /tinymce/jscripts/tiny_mce/plugins/ /tinymce/jscripts/tiny_mce/plugins/<plugin folders> /tinymce/jscripts/tiny_mce/themes/ /tinymce/jscripts/tiny_mce/themes/advanced/ /tinymce/jscripts/tiny_mce/themes/default/ /tinymce/jscripts/tiny_mce/themes/simple/
站点配置
解压完成后,你需要编辑页面,包括TinyMCE的配置及Javascript。请注意,你或许应该在需要的页面中添加TinyMCE的javascript引用,而不是站点的所有页面都需要。注意要正确的知道js文件的路径。
最基本的XHTML 1.1页面整合(将页面中所有textarea元素转化为编辑器)
请在测试下面的代码前务必阅读两个注释(<!—开始):
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" dir="ltr"> <head> <title>TinyMCE Test</title> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <script type="text/javascript" src="../jscripts/tiny_mce/tiny_mce.js"></script> <script type="text/javascript"> tinyMCE.init({ mode : "textareas" }); </script> </head> <body> <form method="post" action="show.php"> <p> <textarea name="content" cols="50" rows="15">This is some content that will be editable with TinyMCE.</textarea> <input type="submit" value="Save" /> </p> </form> </body> </html>
本例中的保存按钮将textarea的内容发生给show.php文件,该文件会简单的显示提交的内容,如果你的代码形如(当然你也可以更加需要的将内容写入文件或数据库):
<?php /* post.php : this page shows what insert.php has sent */ echo(stripslashes($_POST['content'])); ?>
添加多个按钮
稍微改动一下代码:
<script type="text/javascript"> tinyMCE.init({ mode : "textareas" }); </script>
改为:
<script type="text/javascript"> tinyMCE.init({ theme : "advanced", mode : "textareas", plugins : "fullpage", theme_advanced_buttons3_add : "fullpage" }); </script>
结论:这一部分将控制编辑器的外观和功能,你可以根据TinyMCE:Configuration,结合自己的实际来进行配置。
插件开发[ ]
相关资源[ ]
官方地址:http://tinymce.moxiecode.com/
软件类型:开源软件