首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Web前端 >

FCKeditor 学习小结

2012-09-01 
FCKeditor学习总结 下载 FCKeditor地址:http://docs.Fckeditor.netdownload 文档 docs 帮助 步骤:step1 :

FCKeditor 学习总结
 下载 FCKeditor    地址:http://docs.Fckeditor.net   download;
 文档 docs 帮助
 步骤:
        step1 :导入js文件<script type="text/javascropt" src="fckeditor/fckeditor.js" ><script>
        step2:
  method1 :Go to the body of your page ,to the place you want the editor to be and place the t following script  there;
  <script type="text/javascropt">
   var fck = new FCKeditor("fck");//一个叫做fck 的FCKeditor 
   fck.BasePath = "/项目名/fckeditor/";
   fck.Create();
  <script>
  
  method2 :
  step1:  In <head> add the "onLoad" method;
                          var fck = new FCKeditor("myFck");
                          fck.BasePath = "fckeditor/";
             fck.ReplaceTextarea();
  step2:  In <body> add the below code to replace an exsting textarea in the page;
                          <textarea name="myFck"></textarea> 
 注意:BasePath一定要以“/”结束
 其他属性:Width 宽度 100%;Heigh 高度 200; Value 初始类容 空值;
   BasePath 编辑器的基路径 /fckeditor/ ;  ToolbarSet 工具集合名称 Default/Basic/自己订制;
  var FCKeditor = function(instanceName,width,height,toobarSet,value);instanceName必需指定;
 
 在jsp中通过自定义表签调用FCKeditor
 step1:下载fckeditor-java-demo实例 ,fckeditor-java-bin.下   标签文档:site /index.html  Tag library
            导入jar 包fckeditor-java-core 和 lib下三个包 fckeditor-java-demo下所有包
 step2: 在page导入标签<%@ taglib url="http://java/fckeditor.net" prefix="FCK"%>
 step3: 使用<FCK:editor instanceName="myFCK" basePath="/fckeditor" value=" "/>
  注意:basePath:表示在当前工程下     value:必须指定值,并且不能为空值

 使用配置文件 :
 step1:建立并且配置一个新js文件webroot 下myconfig.js 覆盖 原有文件fckconfig.js
 step2:method1:直接在fckxonfig.js中配置
  fckconfig.customconfigurationPath="myconfig.js" 
  mehod2:Find the following ling in the main configuration file(fckconfig.js)
  fckconfig.customconfigurationPath="";
  and put the path of you custom configuration file ;
  fckconfig.customconfigurationPath="myconfig.js" 
            method3:There is an even way better  to hava the same resut as descriped above but without touching the fckconfig.js file
   you can set the custom configurations path directly in the page that uses the editor,This is an example to achive javascript;
   var fck = new FCKeditor("fck");//一个叫做fck 的FCKeditor 
  fck.config["CustomConfiguration"] ="myconfig.js";
  fck.Create();   
        修改配置文件
  1.编辑toobarSet,去掉一些不常用的功能
  在原fckxonfig.js中找到配置FCKConfig.ToolbarSets["Default"]
  复制到myconfig.js中修改对应的元素“-”表示“|”“/”表示换行
  把原Default改个名字FCKConfig.ToolbarSets["itcastbbs"]
  并且指定配置文件
  <script type="text/javascropt">
   var fck = new FCKeditor("fck");//一个叫做fck 的FCKeditor 
   fck.BasePath = "/项目名/fckeditor/";
   fck.config["CustomConfiguration"] ="myconfig.js";
   fck.ToolbarSet="itcastbbs";
   fck.Create();
  <script>
  2.加入几种常用的字体
  在原fckxonfig.js中找到配置FCKConfig.FontNames,复制到myconfig.js中修改对应的元素
  3.修改“回车”和“Shift+回车”的换行功能
  在原fckxonfig.js中找到配置FCKConfig.EnterMode 和FCKConfig.ShiftEnterMode
  4.编辑框样式
  在原fckxonfig.js中找到配置FCKConfig.EditorAreaCSS = FCKConfig.BasePath +'css/fck_editorarea.css';修改样式文件
  5.编辑头像图片
  在原fckxonfig.js中找到配置FCKConfig.SmileyPath ,FCKConfig.SmileyImages ,FCKConfig.SmileyColumns ,
  FCKConfig.SmileyWindowWidth,FCKConfig.SmileyWindowHeight
  复制图片到smileyPath的地址下,然后在SmileyIages添加对应图片的名称
  FCKeditor.BasePath="http://localhost.....项目名/"
  FCKConfig.BasePath="http://localhost......fckeditor/editor/"
  FCKConfig.EditorPath="http://localhost......fckeditor/"
  FCKConfig.EditorPath="http://localhost......fckeditor/"

热点排行