Search code examples
javascriptlatexmathjax

How can I use MathJax or LaTex in an html file?


I cannot get it to work and I'm not sure what I'm doing wrong.

I've downloaded MathJax.js, created an html file and linked it to the js file appropriately. I even copied and pasted from a previously answered question on here and just changed the link from a vpn (the vpn didn't work either, but the question and response were over three years old) to the js file on my machine.

Here's what I have in my html:

<html>
   <head>
    <title>MathJax</title>
    <script type="text/x-mathjax-config">
    MathJax.Hub.Config({"HTML-CSS": { preferredFont: "TeX", availableFonts: ["STIX","TeX"] },
        tex2jax: { inlineMath: [ ["$", "$"], ["\\\\(","\\\\)"] ], displayMath: [ ["$$","$$"], ["\\[", "\\]"] ], processEscapes: true, ignoreClass: "tex2jax_ignore|dno" },
        TeX: { noUndefined: { attributes: { mathcolor: "red", mathbackground: "#FFEEEE", mathsize: "90%" } } },
        messageStyle: "none"
    });
    </script>    
    <script type="text/javascript" src="MathJax.js"></script>
    <script type="text/javascript" src="latest.js"></script>

  </head>
  <body>
     The definition of the Euler-Mascheroni constant is
     \gamma=\lim_{n\to\infty}\left(\sum_{k=1}^n\frac1k-ln(n)\right) 
  </body>
</html>

I would greatly appreciate any assistance.


Solution

  • There are a few problems.

    • If you don't specify a so-called combined configuration file, you need to specify all necessary components yourself. In particular, input, output and in your case the TeX pre-processor to find TeX markup in the page
    • If you use TeX input, you need to wrap input in the delimiters of your choice.

    For example

        <script type="text/x-mathjax-config">
        MathJax.Hub.Config({
          jax: ["input/TeX", "output/HTML-CSS"],
          extensions: ["tex2jax.js"],
          "HTML-CSS": { preferredFont: "TeX", availableFonts: ["STIX","TeX"] },
          tex2jax: { inlineMath: [ ["$", "$"], ["\\(","\\)"] ], displayMath: [ ["$$","$$"], ["\\[", "\\]"] ], processEscapes: true, ignoreClass: "tex2jax_ignore|dno" },
          TeX: { noUndefined: { attributes: { mathcolor: "red", mathbackground: "#FFEEEE", mathsize: "90%" } } },
          messageStyle: "none"
        });
        </script>    
        <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js"></script>
    
         The definition of the Euler-Mascheroni constant is
         $\gamma=\lim_{n\to\infty}\left(\sum_{k=1}^n\frac1k-ln(n)\right) $

    Caveat. I don't know what latest.js should do and you seem to be using a local installation so be sure to check the docs for that, http://docs.mathjax.org/en/latest/installation.html.