Creating Accessible Equations Using MathType

Configure Drupal to accept MathType

Create Equation

Paste Code into Drupal

Edit an Equation after it has been entered into Drupal

Known Issues

Orientation Note

Configure Drupal to accept MathType

• Log-in to the course
• Go to Modules
• Select MathJax module
• Save Configuration
• Configure The module by going to <site>/admin/config/content/mathjax
• Make sure that "Use MathJax Content Delivery Network (CDN)" is checked
• The "MathJax CDN URL" should be set to  https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-AMS-MML_HTMLorMML   
• NOTE: The above URL is for version 2.7 which as of 4-10-17 is the current version. This may need to be checked for a more up to date version periodically, but should work regardless. If a year has passed (April 2019) without this changing from 2.7, please check with Marty or Tim to see if an updated version is available.
• Under Configuration Type, check "Custom"
• Replace the custom configuration content with the following code

  MathJax.Hub.Config({
    extensions: ['tex2jax.js'],
    jax: ['input/TeX','output/HTML-CSS'],
    tex2jax: {
      inlineMath: [ ['$','$'], ['\\(','\\)'] ],
      processEscapes: true
    },
    showProcessingMessages: false,
    messageStyle: 'none'
  });

• Save Configuration

Create Equation

Set Preferences in MathType

• Under preferences, select “Cut and Copy Preferences”
• Select “MathML or TeX”
• Choose “MathML 2.0 (namespace attr) if you want to retain annotations, (not preferred).  Otherwise, choose (no namespace)
• Make sure the first option ("Include translator name in translation") is NOT checked.  Make sure “Include MathType data in translation” IS checked.
• ok

Create Equation

• Create the equation using MathType or any other editor.
• If creating in something other than MathType (like LaTex or Word), copy and paste the equation into MathType

Add text to an Equation

• Under Style tab, click text
• To go back to math, choose Math again

Add a Linebreak to an Equation

• Add the following code where you want the linebreak: <mspace linebreak='newline' />

Paste Code into Drupal

• Highlight the equation and copy it. This will automatically copy the code.
• Paste the code into Drupal source code.

Change Position of the Equation

As it is, the code will center the equation. If you want to put the equation inline, simply delete the 'block' from the first line of code and replace it with ‘inline’.

Add Figure Numbers to Equations

Use the following code to add figure numbers to the equations

Edit an Equation after it has been entered into Drupal

It is very tedious to edit an equation directly in Drupal. The easiest thing to do is to make all edits in MathType and then repost to Drupal.

• Copy the equation from Drupal using the normal view (NOT source code)
• Paste the equation into MathType and edit.
• Delete the old equation from Drupal. (MUST delete from source code)
  • If there are multiple equations on a page, place the xxx above the equation you want to delete so it is easier to find.
  • Go into source code and delete everything between the <math> tags.
  • Copy code

Known Issues

Problem with Dollar signs

Note: This used to be a problem but we think that following all of the steps in the Configuring Drupal to accept MathType section alleviates it. If not, see work around below.

If your course has MathJax turned on, the dollar sign acts as some sort of marker to start displaying MathML. This means that anytime you use a dollar sign in a sentence or a table, etc. (but not part of an equation) the page thinks it is time to start displaying MathML.

To force the dollar sign to render properly, either add a forward slash before the dollar sign (\$) in the wysiwyg editor or add a span tag around the dollar sign in the code ($).

Add the "Viewing Math Equations" note to the Orientation & Syllabus

The "Equations" Library page must be added to the Technical Requirements page of the Course Orientation. This page has an up to date list of acceptable browsers as well as directions for how a student can customize the viewing options (set zoom size, etc.)