Como inserir Latex no Blogger utilizando o script da MathJax

Para que tem um blog de Matemática, Física, Química ou outro de exatas que necessite escrever fórmulas, sempre é um problema encontrar um bom editor de fórmulas que fique com uma boa aparência ao ser publicada no blog. A solução definitiva é escrever fórmulas em comandos $\TeX$.

Infelizmente, o Blogger não oferece esse recurso, de modo que temos de instalar um script de terceiros para podermos usufruir de todos os recursos oferecidos pela linguagem $\LaTeX$.

O script da MathJax foi o melhor interpretador $\LaTeX$ que encontrei, pois é fácil de ser instalado no blogger e a tipografia obtida fica ótima!

Veremos neste artigo como instalar o script da MathJax no Blogger e como customizá-lo.

Inserindo um script da MathJax dentro do código html do blog, podemos usar os comando $\TeX$ e obter uma excelente tipografia na renderização das fórmulas. Para a fórmula da equação de segundo grau, por exemplo, vejam o resultado:

$$
x=\frac{-b \pm \sqrt{b^2-4ac}}{2a}
$$

Ao escrevermos fórmulas in-line, ou seja, no meio de uma frase, devem ser escritas entre os símbolos de $ para que o script interprete corretamente. Por exemplo, para o comando $f(x)=x^2$, obteremos este resultado: $f(x)=x^2$.

Para algumas noções básicas de como inserir fórmulas em $\LaTeX$ no blogger, acesse essa página: Exemplos em $\LaTeX$.

Inserindo o Script MathJax no código html

Para inserir o script da MathJax em seu blog, siga o procedimento abaixo:

• Começamos abrindo o Painel do Blogger e escolha o blog em que irá instalar o script;
• Clique em Tema;
• Em Personalizar, clique na seta para baixo para expandir as opções;

• Clique em Editar HTML para acessar o código de seu blog;

• Utilize CRTL+F e procure pela tag </body>. Imediatamente acima, cole o seguinte script:

<!-- Início do código Latex --> <script src='https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?' type='text/javascript'> MathJax.Hub.Config({ HTML: ["input/TeX","output/HTML-CSS"], TeX: { extensions: ["AMSmath.js","AMSsymbols.js"], equationNumbers: { autoNumber: "AMS" } }, extensions: ["tex2jax.js"], jax: ["input/TeX","output/HTML-CSS"], tex2jax: { inlineMath: [ ['$','$'], ["\\(","\\)"] ], displayMath: [ ['$$','$$'], ["\\[","\\]"] ], processEscapes: true }, "HTML-CSS": { availableFonts: ["TeX"], linebreaks: { automatic: true } } }); </script> <!-- Fim do código Latex -->

• Você verá algo semelhante a isso:

• Clique em Visualizar Tema e confira se existe algum erro. Se estiver tudo certo, clique em Salvar.

Teoricamente, basta criar uma postagem e inserir suas fórmulas. Antes de publicar, clique em visualizar para conferir uma prévia.

Sugiro a leitura do artigo Latex em Tempo Real, pois tem algumas dicas e também é possível digitar uma sintaxe e visualizá-la simultaneamente.

Uma informação que acredito ser importante é usar fontes maiores como padrão de texto dos artigos. Se forem muito pequenas, a renderização das fórmulas não ficam tão boas. Eu utilizo fonte 17 e o resultado é muito bom. Caso achem necessário, procurem em outros tutoriais como alterar o tamanho da fonte do seu blog.

Customização

O Script acima vem como default o uso do comando $ (Cifrão simples) para fórmulas inline e $$ cifrões duplos para fórmulas destacadas, ou seja, entre parágrafos. No entanto, podemos alterar estas comandos, caso deseje.

Há alguns anos, havia um script $\TeX$ chamado Greasemonkey, um complemento para o Firefox, que utilizava os comandos [; fórmula ;] para abrir e fechar a sintaxe. Para alterar para este padrão, por exemplo, substitua os cifrões por [; e ;].

Também é possível outros modos, como usar [tex] para abrir e [/tex] para fechar a sintaxe. O mesmo vale para fórmulas destacadas, onde se usam os cifrões duplos. Experimente!

• Leia o artigo Exemplos de Latex

* Artigo atualizado em 24/07/2021: Alteradas as imagens devido à atualização do painel pelo Blogger.

Links para este artigo:

• http://bit.ly/Latex-no-Blogger
• https://www.obaricentrodamente.com/2010/02/latex-no-blogger.html

Veja mais:

• $\LaTeX$ em tempo real
• Exemplos em $\LaTeX$ 
• MathJax - Beautiful math in all browsers
• 10 dicas valiosas para professores blogueiros iniciantes  no blog do Prof. Edigley