Write Mathematical Formula on Drupal with CKEditor's Mathjax Plugin

  • Posted on: 14 February 2015
  • By: oon
Drupal CKEditor Mathjax Dialog

I NEVER ever imagine will put mathematical equation on my blog :))

but ya, may be I just wrong, now I start to put mathematical formula on my blog ;)

ok, here's how to use CKEditor to edit mathematical formula with Mathjax [1] plugin.

MathJax is an open-source JavaScript display engine for LaTeX, MathML, and AsciiMath notation that works in all modern browsers.[2]

I edit this blog with CKEditor [3].

To activate mathjax on CKEditor 4.4+, you should edit your CKEditor configuration for "Full HTML" profile on: admin/config/content/ckeditor/

Then configure "Editor Appearance" > Plugins.

Activate (check) the "Plugin for inserting Mathematical Formula (Mathjax)".

Don't forget to drag the "Insert Mathematical Formula" button from available buttons to current toolbar.

you can start edit your blog and insert mathematical formula by change your editor to Full HTML and press the "Math" button.

Mathjax plugin for CKEditor will only handle your editing phase, to display it correctly on your Drupal, you'll need Mathjax Drupal module [4], enable the module, activate the filter on your "Full HTML" format.

and it's done!

now all you need is the TeX syntax, check it from [5].

here's  the sample at cost function article: http://oo.or.id/content/what-cost-function

[1]http://ckeditor.com/addon/mathjax
[2]http://docs.mathjax.org/en/latest/mathjax.html
[3]http://oo.or.id/search/node/ckeditor
[4]https://www.drupal.org/project/mathjax
[5]http://en.wikibooks.org/wiki/LaTeX/Mathematics

Tags: 

Add new comment

Filtered HTML

  • Web page addresses and e-mail addresses turn into links automatically.
  • Allowed HTML tags: <a> <em> <strong> <cite> <blockquote> <code> <ul> <ol> <li> <dl> <dt> <dd>
  • Lines and paragraphs break automatically.

Plain text

  • No HTML tags allowed.
  • Web page addresses and e-mail addresses turn into links automatically.
  • Lines and paragraphs break automatically.
By submitting this form, you accept the Mollom privacy policy.