{{htmlmetatags> metatag-keywords=(mathtype, google docs, office, math editor, equation, wiris, math, maths, lms, pages, documentation, user-guide, handwritten input, ckeditor) metatag-description=(Learn how to use Mathtype Web to create math and chemistry notation for CKEditor.) }} ====== MathType for CKEditor ====== ===== Demos and integration downloads ===== | [[https://demo.wiris.com/integrations/ckeditor/|Demo site]] | [[https://store.wiris.com/en/products/downloads/mathtype/integrations#free_trial_individual|Download]] | ===== Requirements ===== * CKEditor 3.0 or higher installed. * A valid license to install the integration in a production environment; otherwise, you can use the downloaded file just for demo purposes. ===== 1. Copy files and configuration ===== Unzip the CKEditor [MT] integration and copy the ''ckeditor_wiris'' directory into your CKEditor integration directory. For example, you will have ''ckeditor/plugins/ckeditor_wiris''. The name of the MathType integration directory must be ''ckeditor_wiris''. ==== Technologies ==== Our integration is available for various technologies. Click below on the technology you are using to see full instructions you should follow. * ''mbstring'' extension must be installed and enabled in the server. * Give execution rights to the web server user on the PHP files contained at to ''ckeditor/plugins/ckeditor_wiris/integration''. * Give write permissions to ''ckeditor/plugins/ckeditor_wiris/''cache and to ''ckeditor/plugins/ckeditor_wiris/formulas'' directories to the web server user. Those folders will be used to store formula MathML codes and temporal images. If you prefer, you can configure the location of these folders. * Very large formulas may not be rendered if the //output_buferring// option is enabled. Either disable it or set a high enough value in your server's ''php.ini'' file. === Configuration === Edit ''ckeditor/plugins/ckeditor_wiris/configuration.ini'' to set your own values.[[en:mathtype:mathtype_web:integrations:config-table|This table specifies all possible parameters]]. * Create an application through your IIS control panel with root directory at ''ckeditor/plugins/ckeditor_wiris''. * For versions older than 3.50.0 you need to create the application at ''/ckeditor/plugins/ckeditor_wiris/integration''. If, given your project requirements or architecture, you need to have only one application move ''/ckeditor_wiris/bin'' contents to the ''/bin'' directory of your project and copy the ''Web.config'' configuration to your project ''Web.config''. If you use .NET 4.0 or above use the values of ''Web.config4.0''. * Give write permissions to ''ckeditor/plugins/ckeditor_wiris/cache'' and to ''ckeditor/plugins/ckeditor_wiris/formulas'' directories to the web server user. Those folders will be used to store formula MathML codes and temporal images. If you prefer, you can configure the location of these folders ===Configuration === Edit ''ckeditor/plugins/ckeditor_wiris/configuration.ini'' to set your own values.[[en:mathtype:mathtype_web:integrations:config-table|This table specifies all possible parameters]]. * Install the ''pluginwiris_engine.war''' in your Java web applications server. For example, tomcat. * Give write permissions to ''pluginwiris_engine/cache'' and to ''pluginwiris_engine/formulas'' directories to the web server user. Those folders will be used to store formula MathML codes and temporal images. If you prefer, you can configure the location of these folders. ===Configuration === Edit ''WEB-INF/pluginwiris/configuration.ini'' to set your own values. [[en:mathtype:mathtype_web:integrations:config-table|This table specifies all possible parameters]]. * Install wirispluginengine gem manually. * Specify ''wirispluginengine'' gem inside your application's Gemfile. * Mount ''Wirispluginengine'' engine into your application's ''config/routes.rb'' file, adding the following line: ''mount Wirispluginengine::Engine => 'wirispluginengine''' * Give write permissions to ''wirispluginengine-X.Y.Z/cache'' and to ''wirispluginengine-X.Y.Z/formulas'' directories to the web server user. Those folders will be used to store formula MathML codes and temporal images. If you prefer, you can configure the location of these folders. ===Configuration === Edit ''configuration.ini'' file on ''wirispluginengine'' gem root directory. [[en:mathtype:mathtype_web:integrations:config-table|This table specifies all possible parameters]]. =====2. Include it in your platform===== You **must** include some content on your CKEditor configuration file ''ckeditor/config.js'' (see CKEditor documentation). ====For CKEditor 4==== The result should be like this: /* Copyright (c) 2003-2010, CKSource - Frederico Knabben. All rights reserved. For licensing, see LICENSE.html or http://ckeditor.com/license */ CKEDITOR.editorConfig = function( config ) { // Add[MT]to the integration list config.extraPlugins += (config.extraPlugins.length == 0 ? '' : ',') + 'ckeditor_wiris'; }; If you use the Full MathML mode and for CKeditor versions higher than 4.0 you have to add this line as well: config.allowedContent = true; If you have a configured custom toolbar, you must add ''ckeditor_wiris_formulaEditor''', ''ckeditor_wiris_formulaEditorChemistry''' buttons where you want. ===== 3. WIRISplugins.js===== Add ''WIRISplugin.js'' script. [[en:mathtype:mathtype_web:integrations:mathml-mode|Follow this instructions]]. ===== 4. Testing ===== In order to check if the integration is installed correctly, there is a page that makes some tests on your server. [[en:mathtype:integrations:html:plugins-test|Open this link to see where is your test page]]. ===== 5. Clean and backup===== Visit [[en:mathtype:mathtype_web:integrations:clean-backup|this page]] if you want to know how to clean the cache folder and backup your formula images. ===== External integration ===== Some rich text editors, such as CKEditor or TinyMCE, allow you to specify a URL based location of plugins outside of the normal plugins directory. This option is useful when loading the rich text editor from a CDN or when you want to have the editor directory separate from your custom integrations. In case you are using a programing language for which [MTI] are not available this is also a good option. You can install [MT] integration as an external integration in CKEditor. Using this option you do not need to install any component on your servers. You only need to add the following line to your CKEditor configuration. CKEDITOR.plugins.addExternal('ckeditor_wiris', 'https://www.wiris.net/demo/plugins/ckeditor/', 'plugin.js'); To Include MathType buttons in CKEditor's toolbar: config.toolbar_Full.push({ name: 'wiris', items : [ 'ckeditor_wiris_formulaEditor','ckeditor_wiris_formulaEditorChemistry']});