Angular

This page describes how to add the equation editor to TinyMCE in an Angular application, using npm.

TinyMCE

From your project's root directory, install the equation editor plugin:

npm install @codecogs/fxeditor-tinymce

Add the plugin script to your Angular build configuration's scripts array, after node_modules/tinymce/tinymce.min.js:

"node_modules/@codecogs/fxeditor-tinymce/eqneditor.js"

Update the TinyMCE configuration in your component template, typically src/app/app.component.html, as follows:

<editor [init]="{
  plugins: 'lists link image table code help wordcount eqneditor',
  toolbar: 'bold italic underline eqneditor',
  base_url: '/tinymce',
  suffix: '.min',
  eqneditor_server: 'fxtex.codecogs.com',
  eqneditor_licence: 'fx_pk_your-key-here',
  eqneditor_design: { colour: '#0f7a4d' }
}"></editor>

The last three lines point the plugin at the equation editor, activate it with your licence key and, optionally, set its design (build one on the TinyMCE page). The key is in the licence manager. Every other option is as described on the TinyMCE page.