MathJax plugin default font should be same as that of CKEditor

Question

We are using MathJax plugin as part of CKEditor. The font for MathJax is different from the default font of CKEditor. We would like to change the default font of MathJax plugin to match CKeditor font.

Answer 1

As math formulas are rendered directly by MathJax plugin, you should check how to change font for MathJax itself (see MathJax docs on Font Support).

There is already an answer covering this here - https://stackoverflow.com/a/41475014/646871.

Remember to include proper MathJax config on the same page were CKEditor is used, like:

<script type="text/x-mathjax-config">
    MathJax.Hub.Config({
        "HTML-CSS" : {
            availableFonts : ["STIX"],
            preferredFont : "STIX",
            webFont : "STIX-Web",
            imageFont : null
        }
    } );
</script>

<script src="https://cdn.ckeditor.com/4.7.3/full-all/ckeditor.js"></script>

<textarea name="editor1" id="editor1" rows="10" cols="80"></textarea>

with JS like:

CKEDITOR.replace( 'editor1', {
    extraPlugins: 'mathjax',
    mathJaxLib: '//cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.0/MathJax.js?config=AM_HTMLorMML'
} );