I have forgotten
my Password

Or login with:

  • Facebookhttp://facebook.com/
  • Googlehttps://www.google.com/accounts/o8/id
  • Yahoohttps://me.yahoo.com
Videos featuring the Editor *
* Warning: CodeCogs is not responsible for content on external sites.
Products » Equation Editor »

CK Editor v3.x (plugin v1.3)

A CK Editor plugin that allows equations to be created in HTML.

Example

Usage

  • To create a new equation, first click within the text area where you need to add the equation.
  • Click the fx button on the CK Editor toolbar. This launches the Equation Editor.
  • Create your equation.
  • Select Copy to document to insert the equation into your document at the cursor position.
  • Double-click existing equations to edit them in the Equation Editor.

CK Editor
Example toolbar: CodeCogs Equation Editor button highlighted in a red circle.

Quick Installation

  1. Install the CK Editor in the normal way.
  2. Download EqnEditor_ck3_plugin_v1.3.zip and uncompress it to your desktop or server.
  3. Find the folder where you installed CK Editor. For this documentation we will assume it is ~/ckeditor.
  4. Open the CK Editor plugins folder, ~/ckeditor/plugins and copy in the directory equation from the uncompressed EqnEditor_ck3_plugin_v1.3.zip folder.
  5. Modify the config.js to load the plugin, so it contains as minimum:
    CKEDITOR.editorConfig = function( config )
    {
    config.extraPlugins = 'equation';
    };
  6. Integrate the CK Editor into your HTML page and load in the normal way. If you do make your own custom toolbar, make sure to include Equation in the list of buttons, e.g:
    <html>
    <head>
    <script type="text/javascript" src="http://latex.codecogs.com/integration/ckeditor/ckeditor.js"></script>
    </head>
    <body>
    <textarea id="editor1" name="editor1"></textarea>
    <script type="text/javascript">
    CKEDITOR.replace( 'editor1', { toolbar : [ [ 'Equation', 'Bold', 'Italic' ] ] });
    </script>
    </body>
    </html>

Change History

  • v1 - First version
  • v1.1 - Major upgrade to improve the way javascript opens and populated the equation editor window.
  • v1.1.1 - Minor bug fix that affected IE9. (Reported by PBoysen).
  • v1.1.2 - Minor optimisations to the code.
  • v1.2 - Updated code coinciding with the release of CKEditor 4.x.
  • v1.3 - Improvement support for secure websites. Fixed bug that prevented equations being edited.