Writing Mathematical Equations in WordPress

If you have a academic or scientific blog you may have wondered how to include mathematical equations in your blog without having to resort to the helpful screenshots from other applications. Well you're in luck because there are several possibilities to do it, and we'll see them all.

Equations as Images

As you can imagine, you can use other equation editing programs to produce them, and then save them as images. The result may be good but if you have many equations to include it will be quite tedious and will load your page enormously.

You could use text to create mathematics and this is usually what more people do when they are not needed fractions or other advanced functions. You can also use HTML to write equations but the results are usually bad and poorly legible.


We are still waiting for most browsers to support MathML so that would allow mathematical equations to be displayed correctly using a series of tags in the code, much like how you do HTML. However it seems that there is not much rush to implement this standard so you will find many browsers that are not able to show MathML correctly or will not show it in any way. Until this is solved it is difficult for the scientific community to adopt MathML as a suitable solution, a penalty.

LaTeX Plugin

LaTeX is a fairly common choice in the scientific community. It uses code to show equations and the final document is a postscript or pdf, which generates pretty good documents, good looking and presentation. On the web, the LaTeX equations can be converted to .GIF images.

For WordPress we have a plugin that uses LaTeX to display the code as GIF images within your posts. It would be a great solution, the end of the problem, but there is a big stumbling block, and to use the plugin you should be able to install LaTeX on your server which is usually relegated to dedicated or virtual server solutions, not accessible to most users.

CSS to Write Equations

If you are not satisfied with the above solutions, or can not install LaTeX on your blog, you can get it using Cascade Style (CSS) to show equations. The results are quite good, considering that style sheets were not designed for this purpose. The case is that it works, and what you have to do is alter the individual size, position, margins and edges of the different text elements to be used.

Most browsers support the use of HTML entities [19659009] for mathematical symbols, and this technique is based on that. A character difficult to find is ħ which is used extensively in quantum physics, and its code in "HTML entity" is & # 295; If you want to know more HTML entities for mathematics or other symbols you can find them in this link . The code that we will use in CSS would be this:

To create equations we will use the tag span with the desired class. For example, to create the equation …

we use this code:

And to use, for example, differentials like this …

we would use this other code:

Of course To, you may want (or should) alter some of the values, especially depending on the size of the font. This method, however, is complicated when you have to show long fractions or matrices but for most situations it works great and it's an accessible way to get to include equations on your blog .

NOTICE : this publication is from two years ago or more. If it's a code or a plugin it might not work in the latest versions of WordPress, and if it's a news story it might be obsolete. Then do not say we have not warned you.

Loading …

That may also help you: