CodeCogs®Plugins
OverviewHTML editors
CKEditor 5 CKEditor 4 TinyMCE 6 and 7 TinyMCE 4 Froala Tiptap AngularCMS and LMS
WordPress Moodle Canvas, Blackboard and LTI
Blogger
Other
Google Docs and Slides TiddlyWikiDevelopers
Writing your own
Canvas, Blackboard and LTI
Learning platforms share a standard for plugging in tools: LTI 1.3. The fxEditor LTI tool is one small server that, once registered with a platform, appears in its content picker — Insert from App, External Tool and the like. An instructor opens it, writes the equation, presses Insert, and the equation is placed into the page they were editing as an image.
One deployment serves every platform you register it with: Canvas, Blackboard, Brightspace (D2L), Schoology, Moodle, or any other LTI 1.3 platform. This is what an instructor sees, shown here without an LMS — Insert puts the equation in the panel underneath:
Preview. The tool is built on ltijs,
a maintained LTI 1.3 implementation, but has not yet been launched from each platform in
production. The tool's source is the lti-tool folder in the download in
Customise and download below. If you would like us to host it for
you, contact us.
Running it yourself
It is a Node.js server, and needs a MongoDB database for LTI's platform and session records, and a public HTTPS address — platforms show LTI tools in a frame, which must be secure.
npm install
cp .env.example .env # then set MONGO_URL, EQNEDITOR_LICENCE and EQNEDITOR_DESIGN
cp platforms.example.json platforms.json # then add each platform you register with
npm start| MONGO_URL | The MongoDB connection string. Required. |
| EQNEDITOR_LICENCE | Your fxEditor licence key. Required. |
| EQNEDITOR_DESIGN | The editor's look, as JSON: dialog width, height and scale, toolbar panels and size, colour, equation and markup sizes, undo/redo. Build one in Customise and download — design.json in the download. |
| PORT | Port to listen on. Default 3000. |
| EQNEDITOR_SERVER | Host the equation editor is loaded from: fxtex.codecogs.com. |
| EQNEDITOR_RENDER_URL | The fxTeX Server that draws the inserted images: https://fxtex.codecogs.com, or your own. |
| PLATFORMS_FILE / PLATFORMS_JSON | Where the platform registrations are read from, as a file or inline JSON. |
Customise and download
Make the equation editor your own: choose what it shows, drag panels from
More panels into up to three toolbar rows, and pick a colour and sizes. The preview is
the real LTI 1.3 page, rebuilt as you go. Then add your licence key and download it: an
example.html with a page of equations to edit, loading everything it needs from
fxplugins.codecogs.com.
More panels 0
Your design
The option that gives LTI 1.3 this design — it is already in the download. Leave it out and the editor uses the standard design.
Your key is in the licence manager on fxEditor — or get one. Without a key, the download still works: equations show why they cannot render until you add one.
Complete example
The whole of the page running above: a simple, complete HTML page that loads LTI 1.3 and the
plugin. Every file comes from fxplugins.codecogs.com, so it works as it is —
put in your own licence key. (Keys are shortened here.)
Registering with a platform
Each platform issues its own client ID and endpoints when you register a tool with it; those go
into platforms.json.
Canvas — Admin → Developer Keys → + LTI Key.
Blackboard — register an LTI 1.3 application on the Blackboard developer portal.
Brightspace — Admin Tools → External Learning Tools → LTI Advantage → Register Tool.
Schoology — App Center, LTI 1.3 registration.
Moodle — Site administration → Plugins → External tool → Manage tools. For equations in Moodle's own text editor, the Moodle plugin is the more direct route.
Why an image
LTI hands content back to a platform as HTML, and platforms have no common form for
mathematics beyond that. An <img> drawn by
fxTeX Server, with the LaTeX as its
alt text, is the form every platform displays.