How to add Accessible Mathematics to your rise course. (Including Super and Sub Scripts and Formulas)
Edit 1: Updated with JS to check for dynamically created content.
Edit 2: Updated with /content/lib/main.bundle.js script injection needed for continue buttons and other dynamic content.
Here are the steps to follow for creating accessible Math in rise:
- Use the following site to create your math latex formula: https://www.codecogs.com/latex/eqneditor.php and to confirm the equation displays the way you want. An example of a formula might be x^{2} = \frac{2}{y} which is “x² = 2 / y”
- Copy your latex formula into Rise where you want it, but add “$$” before and after, so: $$x^{2} = \frac{2}{y}$$
- Do this for all equations until you publish.
- After publishing, extract the zip file and open index.html
- After the <head> tag, insert the following Javascript:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.0/MathJax.js?config=TeX-MML-AM_CHTML'></script>
<script type="text/javascript">
// Inspect the array of MutationRecord objects to identify the nature of the change
function mutationObjectCallback(mutationRecordsList) {
mutationRecordsList.forEach(function(mutationRecord) {
if ("attributes" === mutationRecord.type) {
}
});
MathJax.Hub.Queue(["Typeset",MathJax.Hub]);
}
// Create an observer object and assign a callback function
var observerObject = new MutationObserver(mutationObjectCallback);
// the target to watch, this could be #yourUniqueDiv
// we use the body to watch for changes
var targetObject = document.body;
// Register the target node to observe and specify which DOM changes to watch
observerObject.observe(targetObject, {
attributes: true,
attributeFilter: ["id", "dir"],
attributeOldValue: true,
childList: true
});
</script>
6. Finally, in /content/lib/main.bundle.js search for the following code:
return e.createElement("div", null, this.props.children)
and add the following right before it:
MathJax.Hub.Queue(["Typeset",MathJax.Hub]);
+1 for a Equation editor in Rise