Math: Creating Equations

Best practices

Whenever possible, ask your Learning Designer to add or review math equations for you. Math rendering and accessibility can be complex. The guidance below is intended for last-minute situations when you cannot wait for design support. Proceed with caution!

Always review the rendered math before sharing with students.

What you need to know first

  • Do not use LaTeX. LaTeX will break pages in Drupal 10.
  • Do not use images of math. Images of equations are not accessible and violate WCAG requirements.
  • Use built-in tools only. Math in Drupal 10 must be created using MathType (for inline equations) or MathML (for block equations).
  • Math using block equations will not render in edit mode. You must save the page to see the rendered equation. When editing later, you will see the code again—this is normal.

Add inline equations

Use inline equations when math appears within a sentence.

  1. Place your cursor where the equation should appear.
  2. Select the Insert a math equation button (insert a math equation button. Looks like a square root symbol) in the toolbar.
  3. Build the equation in the MathType window. 

    MathType window
    There are three ways to use the MathType Editor
    1. Use the tabs to find the correct math symbols, functions, and characters, and select them as you build the equation.
    2. Copy and paste MathML directly into the MathType window.
    3. Hand-draw the equation by clicking on the hand-draw equation icon. icon on the right side of the MathType window. In the lower-right portion of the MathType window, you will see what your resulting equation will look like when presented on the webpage.

      MathType hand draw editing window
       
  4. Click Insert to add the equation to the page.
  5. Save the page.

Add free‑standing block equations

Use block equations when math:

  • Appears between paragraphs
  • Needs emphasis or spacing
  • Requires an equation number

Example of a free-standing equation

A m 2 = AV W ×Q W *C P * T delivery -T source 11,000 kJ/ m 2 / day
Equation 1.1

Steps

  1. Place your cursor where you want to add an equation, typically between paragraphs.
  2. Open Templates dropdown menu ( ) and select MathML and Figure Number ( MathMl and Figure Number template icon. ).
  3. Double-click on the math equation a2+b2= c2 to open the MathType window.
  4. Edit/create your new equation in the MathType window.
  5. Click the Insert button when you have completed your equation.
  6. Update or remove the EQUATION_NUMBER that appears on the right side of the math-box-container window.
    1. Replace it with a number according to the course style guide.
    2. Double‑click and delete twice to remove the equation number.
  7. Save the page.

Note: If you are looking at this on a mobile-sized screen, the equation number will appear below the equation, not to the right.

Using external tools to create MathML

There are several tools you can use to create MathML code for equations, including Equatio (Mac and PC) and MathType (PC only). Contact your learning designer if you would like help learning how to use either of these tools.

Checking equation accessibility accuracy with speech text

There are two ways to check your equation and make sure it is accurately presented to those who use screen readers.

  1. Use Speech text
    The speech text option will display what will be read by a screen reader when the equation is in focus. This allows you to verify that the numerators and denominators, exponents and subscripts, etc., are correct.
    1. Go to the webpage that contains your equation. Do not select edit.
    2. Right-click on the equation.
    3. Hover over Show Math As
    4. Select Speech Text

      MathJax Speech Text window shows the equation text written in English
  2. Install and use a screen reader to view your course webpage. The learning design team can help you get started with a screen reader.

Editing an equation

Editing the MathML code for complicated block equations can be difficult. The design team is available to assist as needed. If you do not have time to wait for the designer, the best option is to recreate the equation from scratch using the math equation (insert a math equation button. Looks like a square root symbol) tool.

Getting help

Ask your Learning Designer if:

  • The equation is long or complex
  • You need aligned or multi‑line equations
  • You are unsure whether symbols are accessible

Your Learning Designer is your resource for both pedagogy and technical support, including Drupal. Contact them anytime for guidance on creating effective and accessible learning experiences.