Skip to content Skip to sidebar Skip to footer
Home / Html / Latex

Include LaTeX Formulas In HTML Files?

Post a Comment
I saw some sites include LaTeX formulas in their sites. How they do that? Is there any HTML tag or maybe a SSI command to include LaTeX formulas? I prefer there be a server-side co

Solution 1:

MathJax is a possible solution. It is a client-side solution (Javascript) which is compatible with LaTeX syntax.

I think MathTran provides an online outsourcing of your LaTeX files, which you can later embed in your HTML code (much in the way of the Google Chart Tools)

Depending on your server configuration (ie assuming you can install what you want), if the LaTeX files don't change often you could easily schedule a (say) LaTeX -> PNG render (lots of info the web on how to do it) and link the resulting PNG.

Last resort (but the simplest) if you have server limitations (say a shared host), you can just render the LaTeX to an image offline and upload the result.


Solution 2:

MathJax can do that job for you. Check out the website.


Solution 3:

While CodeCogs (updated hyperlink) can be used to separately generate images that you can add later to your webpage using the tag <img>, a valid (and faster loading) alternative to MathJax is given by KaTeX: I paste here a minimal example of implementation of this latter.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Katex</title>
<link  href="https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/katex.min.css" integrity="sha384-zB1R0rpPzHqg7Kpt0Aljp8JPLqbXI3bhnPWROx27a9N0Ll6ZP/+DiW/UqRcLbRjq" crossorigin="anonymous">
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/katex.min.js" integrity="sha384-y23I5Q6l+B6vatafAwxRu/0oK/79VlbSz7Q9aiSZUvyWYIYsd+qj+o24G5ZU2zJz" crossorigin="anonymous"></script>
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/contrib/auto-render.min.js" integrity="sha384-kWPLUVMOks5AQFrykwIup5lo0m3iMkkHrD0uJ4H5cjeGihAutqP0yW0J6dpFiVkI" crossorigin="anonymous" onload="renderMathInElement(document.body);"></script>
</head>

<body>
<p>Blah blah \(e^{i\pi}+1=0\) blah blah blah.</p>
\[e^{i\pi}+1=0\]
<p>Blah blah blah blah blah.</p>
</body>
</html>

All you need to do is to add one link and two script tags to your header, then you can write with LaTeX syntax inline math between the delimiters \( \) and displayed math between the delimiters \[ \].


Post a Comment for "Include LaTeX Formulas In HTML Files?"