MathJax Math
Affichez des équations et des formules mathématiques dans les pages Jekyll à l'aide de MathJax — notation de style LaTeX pour le web.
Table of Contents
MathJax Math
Affichez des équations et formules mathématiques en utilisant une syntaxe de style LaTeX avec MathJax.
Démarrage rapide
Étape 1 : Activer MathJax
Ajoutez mathjax: true au front matter de votre page :
---
title: "My Math Page"
mathjax: true
---
Étape 2 : Écrire des équations
Mathématiques en ligne avec des signes dollar simples :
The Pythagorean theorem states that $a^2 + b^2 = c^2$.
Mathématiques affichées avec des doubles signes dollar :
$$
E = mc^2
$$
Configuration
Intégration au thème
Le thème inclut la prise en charge de MathJax. Le fichier d’inclusion charge MathJax de manière conditionnelle :
{% if page.mathjax %}
<!-- MathJax 3 configuration — must appear before the script tag.
Enables $...$ inline math (off by default in MathJax 3). -->
<script>
window.MathJax = {
tex: {
inlineMath: [['$', '$'], ['\\(', '\\)']],
displayMath: [['$$', '$$'], ['\\[', '\\]']],
processEscapes: true
}
};
</script>
<script id="MathJax-script" async
src="{{ '/assets/vendor/mathjax/es5/tex-mml-chtml.js' | relative_url }}"></script>
{% endif %}
Exemples de syntaxe
Mathématiques en ligne
Utilisez des signes dollar simples ou les délimiteurs \( \) :
| Markdown | Résultat |
|---|---|
$x^2$ |
$x^2$ |
$\sqrt{x}$ |
$\sqrt{x}$ |
$\frac{a}{b}$ |
$\frac{a}{b}$ |
$\sum_{i=1}^n x_i$ |
$\sum_{i=1}^n x_i$ |
Mathématiques affichées
Utilisez des doubles signes dollar ou les délimiteurs \[ \] pour des équations centrées :
$$
\int_0^\infty e^{-x^2} dx = \frac{\sqrt{\pi}}{2}
$$
Formules courantes
Formule quadratique :
$$
x = \frac{-b \pm \sqrt{b^2 - 4ac}}{2a}
$$
Matrice :
$$
A = \begin{pmatrix}
a & b \\
c & d
\end{pmatrix}
$$
Référence LaTeX
Lettres grecques
| Code | Symbole | Code | Symbole |
|---|---|---|---|
\alpha |
$\alpha$ | \beta |
$\beta$ |
\gamma |
$\gamma$ | \delta |
$\delta$ |
\pi |
$\pi$ | \sigma |
$\sigma$ |
\omega |
$\omega$ | \theta |
$\theta$ |
Opérateurs
| Code | Symbole | Description |
|---|---|---|
\sum |
$\sum$ | Sommation |
\prod |
$\prod$ | Produit |
\int |
$\int$ | Intégrale |
\partial |
$\partial$ | Dérivée partielle |
\infty |
$\infty$ | Infini |
\approx |
$\approx$ | Approximativement |
\neq |
$\neq$ | Différent de |
\leq |
$\leq$ | Inférieur ou égal |
Mise en forme
| Code | Résultat | Description |
|---|---|---|
x^2 |
$x^2$ | Exposant |
x_i |
$x_i$ | Indice |
\frac{a}{b} |
$\frac{a}{b}$ | Fraction |
\sqrt{x} |
$\sqrt{x}$ | Racine carrée |
\sqrt[n]{x} |
$\sqrt[n]{x}$ | Racine n-ième |
\overline{x} |
$\overline{x}$ | Surlignage |
\hat{x} |
$\hat{x}$ | Accent circonflexe |
Dépannage
Les équations ne s’affichent pas
- Vérifiez le front matter — assurez-vous que
mathjax: trueest défini - Vérifiez les délimiteurs — utilisez
$...$pour le mode en ligne,$$...$$pour le mode affiché - Échappez les caractères spéciaux — utilisez
\\pour la barre oblique inverse dans certains contextes - Vérifiez la console du navigateur — recherchez les erreurs de chargement de MathJax
Conflits liés au signe dollar
Si vous avez besoin de signes dollar littéraux, échappez-les :
The price is \$5.00, but the formula is $x^2$.
Compatibilité avec Kramdown
Kramdown traite le contenu avant MathJax. Pour les équations complexes, utilisez les délimiteurs \[ et \] ou encapsulez-les dans du HTML :
<div>
$$
\text{Complex equation here}
$$
</div>
Conseils de performance
- Activez uniquement lorsque nécessaire — utilisez
mathjax: truede façon sélective - Utilisez le chargement asynchrone — le script CDN inclut l’attribut
async - Réduisez le nombre d’équations — les équations complexes ralentissent le rendu
- Envisagez le pré-rendu — pour le contenu statique, utilisez des images
Ressources
- Documentation MathJax
- Symboles mathématiques LaTeX
- Detexify — Dessinez des symboles pour trouver le code LaTeX
- HostMath — Éditeur d’équations en ligne
Ce guide fait partie de la documentation du thème Jekyll Zer0-Mistakes.
Voir aussi
- [[Features]]
- [[Mermaid Diagrams]]
- [[Jupyter Notebook Integration]]