Login |  Register |  Password

Tips: mathematical expressions, equations, and equation numbering

Submitted by ranjan on Tue, 06/30/2009 - 08:43.

Newton's second law is the fundamental equation of dynamics (1).

For this article, the above statement is just an example showing how we can refer to a mathematical equation on the same page.

Mathematical expressions can be inserted in our content easily. We'll need the LaTeX symbol list, a few examples to start with, and two important links on the content creation /editing page - "disable rich-text" and "Input format".

For most of the content types, an HTML editor opens in WYSIWYG (What You See Is What You Get - visual formatting) mode. Use various buttons and options in the toolbar of the editor to format your content.

To see the HTML code of the edited content, we can "disable rich-text" mode of the editor. Generally, we won't need to do that. Only when we need to insert an equation which should get a number automatically, we'll need to disable the rich-text mode. We have one such equation on this page later.

If you want to insert mathematical expressions, the most important thing is to select "TeX in HTML" by clicking on the "Input format" link below the edit area for the content body. [The default input format is "Full HTML".]

There are 3 important modes of inserting mathematical expressions within your HTML content:

  • inline mode
    • delimiter - $
    • examples -
      • do this integration by parts: $ \int \ln(x) \; dx $. [LaTeX code: $\int \ln(x) \; dx$.] First step is $ = x \cdot \ln(x) - \int x \cdot d(\ln(x)) $. [LaTeX code: $ = x \cdot \ln(x) - \int x \cdot d(\ln(x))$.] Complete the rest.
      • sample eq1: $ \vec{F} = -\vec{\nabla} U $, and sample eq2: $ \sum_{k=1}^\infty \frac{1}{k} $. [LaTeX code: $\vec{F} = -\vec{\nabla} U$, and $\sum_{k=1}^\infty \frac{1}{k}$.]
  • display or paragraph mode
    • delimiter - $$
    • examples -
      • do this integration by parts:
        $$\int \ln(x) \; dx.$$

        [LaTeX code: $$\int \ln(x) \; dx.$$] First step is

        $$<br /> = x \cdot \ln(x) - \int x \cdot d(\ln(x)).$$

        [LaTeX code: $$ = x \cdot \ln(x) - \int x \cdot d(\ln(x)).$$] Complete the rest.

      • sample eq1:
        $$\vec{F} = -\vec{\nabla} U,$$

        and sample eq2:

        $$\sum_{k=1}^\infty \frac{1}{k}$$

        [LaTeX code: $$\vec{F} = -\vec{\nabla} U,$$ and $$\sum_{k=1}^\infty \frac{1}{k}$$]

  • display-style inline mode
    • delimiter - $!
    • examples -
      • do this integration by parts: $\displaystyle \int \ln(x) \; dx $. [LaTeX code: $!\int \ln(x) \; dx.$] First step is $\displaystyle<br /> = x \cdot \ln(x) - \int x \cdot d(\ln(x)). $ [LaTeX code: $! = x \cdot \ln(x) - \int x \cdot d(\ln(x)).$] Complete the rest.
      • sample eq1: $\displaystyle \vec{F} = -\vec{\nabla} U, $ and sample eq2: $\displaystyle \sum_{k=1}^\infty \frac{1}{k} $ [LaTeX code: $!\vec{F} = -\vec{\nabla} U,$ and $!\sum_{k=1}^\infty \frac{1}{k}$]

We can use any of these modes. However, the display mode results in better rendering of subscripts and superscripts of $\displaystyle \sum $, $\displaystyle \int $, and fractions like $\displaystyle \frac{a}{b} $.


Note that our content with mathematical expressions will contain both HTML and LaTeX/TeX code. To insert a $ character as a symbol (and not as a delimiter for mathematical expression), we precede it with a backslash (\).

In case, we want to number the equations on a page, and refer to them by their equation numbers, we can enclose the mathematical expression for the equation within <equation> and </equation>. We need to put an id for the euqation, and use the same id to refer to it.

In other words, we use a new HTML element: <equation id='someId'> .. </equation>.

Here is an example. The following LaTeX+HTML code:

<equation id="newton2">m \frac{d\vec{v}}{d t} = \vec{F}</equation>
will produce -

\[ m \frac{d\vec{v}}{d t} = \vec{F} \] (1)

The LaTeX code for the HTML equation element must be typed in with rich-text mode disabled.

We can refer to this equation anywhere on the same page simply by putting
"(\ref{newton2})".
For example, the following HTML code: 

we can say that the Newton's second law is the fundamental 
equation of dynamics (\ref{newton2}).

will appear on a saved content page as: we can say that the Newton's second law is the fundamental equation of dynamics (1).