Collection of jQuery Rich-Text Editor Plugins: FCKEditor, Codepress | Other jQuery plugins: Multiple File Upload
 
 
If you like this, digg it!

jQuery FCKEditor Plugin v1.1

 

This is an archived copy of this plugin, click here for the latest version

 

Download | Official Project Page | Report Bug | By DMA, Expert SEO

Other links: FCKEditor Official Website | Form Plugin | Validation Plugin | jQuery Library

To Support this project just checkout a related website:

What does it do?

 
 

Try it yourself

Conventional Submission (iFRAME)

This type of submission always works without the plugin.
 

Ajax Submission (DIV)

This type of submission would not work without this plugin.
(Ajax Form submission powered by the jQuery Form Plugin)
 
 

Download

All you really need is FKCEditor (DUH!), jQuery (of course) and the jQuery FCKEditor Plugin.

But if you want to submit your form via Ajax, then you need to get the jQuery Form Plugin by Malsup.

 
 

Usage

  • Method 1: replacing ALL textareas in a page with THE SAME settings
    <textarea name="fck1" cols="50" rows="6"></textarea>
    <textarea name="fck2" cols="50" rows="6"></textarea>
    <textarea name="fck3" cols="50" rows="6"></textarea>
    <script> $(function(){ $('textarea').fck({path: '/path/to/fck/directory/'}); }); </script>
      
  • Method 2: replacing SOME textareas in a page with THE SAME settings
    In this example, only textarea fck3 will not be converted into a FCKEditor.
    <textarea name="fck1" class="fck" cols="50" rows="6"></textarea>
    <textarea name="fck2" class="fck" cols="50" rows="6"></textarea>
    <textarea name="fck3" cols="50" rows="6"></textarea>
    <script> $(function(){ $('textarea.fck').fck({path: '/path/to/fck/directory/'}); }); </script>
      
  • Method 3: replacing SOME textareas in a page with DIFFERENT SETTINGS
    <textarea name="fck1" cols="50" rows="6"></textarea>
    <textarea name="fck2" cols="50" rows="6"></textarea>
    <textarea name="fck3" cols="50" rows="6"></textarea>
    <script>
     $(function(){
      $.fck.config = {path: '/path/to/fck/directory/', height:300 };
      $('textarea#fck1').fck(/* default settings */);
      $('textarea#fck2').fck({ toolbar:'MyCustomerToolbar' });
      $('textarea#fck3').fck({ toolbar:'MyCustomerToolbar', height:200 });
     });
    </script>
      
 
 

Important pointers...

  • This is a working idea that hasn't yet been fully tested.
    Tested and works on Firefox 2, Opera, Safari (Win), IE7 and IE6 (all in WinXP SP2).
  • The same principle can be applied to TinyMCE, Codepress and any other rich-text editors.
    Any input regarding other rich-text editors is welcome.
  • The plugin will intercept known methods and install itself against related plugins (currently only the jQuery Form Plugin).
    Any input regarding integrating this plugin with other jQuery plugins is welcome.
 
To Support this project just checkout a related website: