:: Table of Contents
Usage
QuickstartEditor integrationAPIDesignLaTeX rendering
Plugins
LaTeX ITCK Editor v5Tiny MCE v6BloggerAngularDeveloper Guide

CK Editor v4.x - plugin v2.2

The Equation Editor plugin for CK Editor

Usage

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

Quick Installation

  1. Install the CK Editor as they recommend.
  2. Download CK-EqnEditor-plugin and uncompress it:
    Download CKEditor EqnEditor.zip
  3. Find the folder where you installed CK Editor. For our purposes we will assume this is ~/ckeditor.
  4. Open the CK Editor plugins folder ~/ckeditor/plugins and copy in the directory equation/ from the uncompressed folder you downloaded.
  5. Modify the config.js to load the plugin by adding config.extraPlugins = 'eqneditor';, i.e.

    Modify config.js :

    CKEDITOR.editorConfig = function(config) {
	config.extraPlugins = 'eqneditor';
	
	config.toolbarGroups = [
		...
	];
  6. Integrate the CK Editor into your HTML page and load in the normal way.
  7. The CodeCogs Equation Editor will appear within the insert toolbar Group.
  8. If you are using a customised toolbar, ensure EqnEditor is included in the list of buttons, e.g:

    Add to <body> :

    <textarea id="editor1" name="editor1"></textarea>
<script>
  CKEDITOR.replace( 'editor1', { toolbar : [ [ 'EqnEditor', 'Bold', 'Italic' ] ] });
</script>

Change History

Copied to clipboard