I’ve been working at Design Science for a couple of months now, as Senior Product Manager concentrating on the MathFlow products. So I figured I should enable MathML support on my blog. It’s not hard, but like everything in tech there are a few niggly details. Many of those issues are caused by WordPress’s over-eager helpfulness, which has to be reined in on a regular basis if you’re doing anything at all out of the ordinary. Like editing your posts directly in HTML rather than using some pseudo-WYSIWYG editor.
Theoretically, showing MathML in a browser is easy, at least for the sort of equations that most people put in blog posts, even though not all browsers support MathML directly. You just use the MathJax JavaScript library. On WordPress there is even a plugin that adds the right script element, the MathJax-Latex plugin. You can make every page load MathJax, or use the [mathjax] shortcode to tell it when to load.
The wrinkle comes with WordPress’ tendency to “correct” the markup. When you add the MathML, WordPress sprinkles it with <br/> tags. MathJax chokes on those and shows nothing. Since the tags don’t show up in the editor view, you need some way of stopping WordPress from adding them. The best way I’ve found is with the Raw HTML plugin.
But there’s a wrinkle with that too. For some reason if you use the shortcode version of the begin and end markers ([raw]) the editor decides that the XML characters between those markers has to be turned into the character entities, so for example the < characters are turned into <. To stop that, you need to a) check all the checkboxes in the Raw HTML settings on the post, and b) use the comment version (<– raw –> and <– /raw –>) to mark the beginning and end of the section instead of the shortcode version.
Once it’s done it’s easy to add equations to your pages, so it’s worth the extra few minutes to set it all up.
A couple of examples taken from the MathJax samples page
and one from my thesis from way back when