I have recently started a blog, in which I talk about programming, reading, science, and math. Now, for the programming part, I have installed SyntaxHighlighter, but I am rather confused with what I should use for math. I'm thinking about using MathJax, since I'm used to it and it's pretty good. The issue is, MathJax will interfere with other stuff. For example, it can interfere with any PHP code (which has lots of dollar signs) that I use on a programming post.
Now I want to keep the inline/block dollar signs, but I don't want it to blow up other stuff. I was thinking about associating MathJax with a certain CSS class, so that I can enclose all sections which use math extensively with those tags. By this, I mean that I can still type normally within those divs (without having it math-ified), but I can use the dollar signs and get math code. Outside the divs, any dollar signs will be left alone.
Does anyone know a configuration option that lets me do this? I know JS, but I can't find any options in the documentation. Thought I'd ask here before plowing through the code.
add class="tex2jax_ignore" to your document <body> tag, and then use class="tex2jax_process" on the containers for the parts of your page where you want to include mathematics. As others have pointed out, you can configure the class names to use for these features. E.g.
<script type="text/x-mathjax-config">
MathJax.Hub.Config({
tex2jax: {
inlineMath: [['$','$'],['\\(','\\)']],
processClass: "mathjax",
ignoreClass: "no-mathjax"
}
});
</script>
Then your page would be
<html>
<head>
...
</head>
<body class="no-mathjax">
...
<div class="mathjax">
... (math goes here) ...
</div>
...
</body>
</html>
Hope that helps.
Davide
Credit: #MarkS.Everitt
http://www.mathjax.org/docs/1.1/options/tex2jax.html
There is a configuration option, processClass: "tex2jax_process"
The final configuration becomes:
tex2jax: {
inlineMath: [['$','$'], ['\\(','\\)']],'
ignoreClass: "[a-zA-Z1-9]*",
processClass: "math"
}
});
The existing answers are IMO not real solutions because they involve modifying your HTML. Sometimes this isn't even possible, but even when it is, who wants to dirty their markup with meaningless CSS classes just to get MathJax working?
Insert the following tag before the <script> tag that imports MathJax:
<script type="text/x-mathjax-config">
MathJax.Hub.Config(
{
elements: mathElements
}
);
</script>
where mathElements contains a list of DOM elements to be processed, for example something like var mathElements = document.querySelectorAll("article").
Related
I am new to coding and trying to write elementary math functions using MathML on MathJax 2.6.1. We recently acquired the function to be able to "carry" numbers in long addition, subtraction, etc.
Can someone show me how to implement this extension?
It is not clear if you are asking how to write MathML that includes <mcarries>, or if you are asking how to get MathJax to process <mcarries> elements. For the former, see the MathML specification examples. For the latter, you need to load the mml3 extension, which says to include
<script type="text/x-mathjax-config">
MathJax.Hub.Config({
MathML: {
extensions: ["mml3.js"]
}
});
</script>
somewhere before the script that loads MathJax.js itself.
I'm using MathJax in a hand-written web page (which is unfortunately not online yet, so I cannot point you to the whole source code).
I embed MathJax in the page as follows, which is simply copy/pasted from the official documentation:
<script type="text/x-mathjax-config">
MathJax.Hub.Config({
"HTML-CSS": {
webFont: "TeX"
}
});
</script>
<script
type="text/javascript"
src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS_HTML.js">
</script>
After that, MathJax seems to work well on every formula I tried, but I cannot get it to render the \TeX and \LaTeX commands to obtain the TeX and LaTeX logos. Everything on the web makes it look like these two commands are supported by MathJax, and I remember of having used them with MathJax in a wordpress blog years ago, so I think there must be some extension or option missing.
So why are those commands not working and what can I do to fix them? Or are they not supported?
MathJax only processes the math on the page, not other text-mode macros. So if you want MathJax to process the \TeX or \LaTeX macros, try using
$\rm\TeX$ or $\rm\LaTeX$
in your page instead.
EDIT:
Here is an example. Run the code snippet to see it work.
<script src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS_HTML"></script>
\(\rm\TeX\) and \(\rm\LaTeX\)
Is there any way to un-render a template with hogan.js. You can just hide it, but that leave's a lot of elements with id's and it can mess up further effects on your site.
I have looked around, but can't find an answer to this. Thanks
hogan.js is a templating language. What means that one can easly render different html markups just using some javascript object. It does not have the purpose of manipulating the DOM.
Lets say you got html like this:
<body>
...stuff...
<div id="div-1">...stuff...</div>
</body>
You could use of course jQuery:
$('#div-1').remove();
Or if it saves trouble you can use pure javascript:
var elem = document.getElementById('div-1');
elem.parentNode.removeChild(elem);
If MathJax can export formula as image, I can use to insert it to a webpage easily. Unfortunately, current MathJax don't support to export image! :(
Is there a simple way to create a embeded code to show formula just like Twitter above? If you have, could you show me some sample codes? Thanks!
< href="https://twitter.com/share" class="twitter-share-button" data-count="horizontal" data-via="my">Tweet
< script type="text/javascript" src="//platform.twitter.com/widgets.js">
See my response to this question on the MathJax user's forum.
MathJax does not have image creation capabilities, and I don't know of a way to
make that possible from Javascript (a quick web search suggests it is not readily doable).
If you are looking to convert TeX to images, there are plenty of tools for doing that
already. You could, for example, use TeX with dvipng, or one of the tools designed for
that like the LaTeX Equation Editor or Laeqed applications. There are a number of
on-line tools for doing this as well.
This question is already kinda old. But was searching for something like this myself. Apparently there are some Tex Rendering Services Available.
Take a look at this Answer:
https://meta.stackexchange.com/questions/53436/implement-an-api-call-to-display-latex-as-inline-image
Try this
<html>
<head>
<script type="text/javascript" async src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-MML-AM_CHTML">
</script>
</head>
<body>
$$e = mc^2$$
</body>
</html>
http://jsfiddle.net/16h1hjot
I was just going through some security blogs and I found this image of an major financial entity and I was not sure of what could have caused this kind of error to appear on client facing page and how to fix it so that we do not have any potential security loop hole in the system ?
It looks like a badly closed workaround to use CDATA in browsers that don't support XHTML.
For example, this is fine in HTML:
<script type="text/javascript">
if (1 > 0) {
}
</script>
However, because of >, this wouldn't work in XHTML. For this, you would have to use CDATA to escape the script itself, like this:
<script type="text/javascript">
//<![CDATA[
if (1 > 0) {
}
//]]>
</script>
Here, the CDATA is within the script, but a comment as far as the script is concerned.
Some browsers don't seem to like the CDATA in HTML, so some people use a trick to double-escape the CDATA with XML comments on top of this:
<script type="text/javascript">
<!--//--><![CDATA[//><!--
if (1 > 0) {
}
//--><!]]>
</script>
It looks like your problem comes from one of these double-escape tricks to be badly closed. (//--><!]]> may have to be on the same line).
I'm not sure if it's a security issue as such; it would depend on what else is incorrectly displayed/transformed (this may come from a server-side XSLT or similar).