It’s research the best way to render LaTeX-style math formulas in WordPress Gutenberg and how to copy them properly from ChatGPT without breaking formatting. I’ll also find the best plugin for this and provide a sample prompt you can use to get formulas from me in a compatible format.
——————————-
When working with mathematical formulas from ChatGPT, the key is to use a WordPress plugin that can render LaTeX in the Gutenberg editor. This ensures formulas like R_{in} = \frac{\Delta U}{\Delta I} or SoH = \frac{Q_{max,current}}{Q_{max,new}} \times 100\% appear as properly formatted math on your site (not plain text). Below, we identify the top plugins for this task, compare their features, and provide step-by-step instructions. We’ll also suggest a ChatGPT prompt to get formulas in the correct format for easy pasting.
Best WordPress Plugins for Rendering LaTeX in Gutenberg
1. MathML Block (MathJax): A Gutenberg block plugin that uses MathJax (a JavaScript engine) to render LaTeX and MathML. It adds a dedicated “MathML” block for equations and even an inline-equation tool in the editor toolbar. You can paste LaTeX code directly into this block (surrounded by \[ ... \] for display equations) and see it render live. For example, after installing, add a MathML block and enter:
\[ x = \frac{-b \pm \sqrt{b^2-4ac}}{2a} \]
This will display as a formatted formula in the editor and on your site. (The plugin supports inline math as well: type an expression in a Paragraph block, select it, and click the “M” icon to format it as math.)
2. WP QuickLaTeX: A plugin that lets you write LaTeX directly in posts/pages. It converts formulas to high-quality SVG images using an online LaTeX service. With this plugin, you can paste standard LaTeX expressions (inline math in $...$ or display math in \[...\] or \begin{equation}...\end{equation}) straight into Gutenberg – no extra tags needed. To trigger conversion on a page, you either add a [latexpage] shortcode at the start (or enable a site-wide option). For example, in a Shortcode block you might put:
[latexpage]
$R_{in} = \frac{\Delta U}{\Delta I}$
This will render the formula as an image on the front end. WP QuickLaTeX supports advanced LaTeX features (AMSmath, automatic equation numbering, etc.) and will align inline formulas properly with text. (Note: ensure the % symbol is written as \% in LaTeX to avoid comments – ChatGPT can do this for you in its output.)
3. MathJax-LaTeX: A plugin that embeds the MathJax engine on pages that need it (on-demand). It allows multiple syntaxes for math: the recommended way is to wrap LaTeX in a shortcode. For example, you would insert a Shortcode block in Gutenberg containing:
[latex]SoH = \frac{Q_{max,current}}{Q_{max,new}} \times 100\%[/latex]
This ensures MathJax is loaded and renders the formula. The plugin also recognizes $$ ... $$ or \( ... \) delimiters for math****, but if you use those alone you’ll need to add a [mathjax] shortcode somewhere in the post to trigger the script load. MathJax-LaTeX is lightweight – it injects the MathJax script only on pages that have math (avoiding slowdown on other pages). It produces beautifully crisp output via MathJax (client-side rendering with HTML/CSS).
(Another option is Jetpack’s built-in LaTeX support: if you already use Jetpack, you can insert math by typing in a Custom HTML or Shortcode block. This will render an image of the formula on your site. However, Jetpack’s method is essentially a wrapper for an image service and doesn’t offer live preview in the editor.)
Comparison of Top Math Plugins
The table below compares key features of popular math-rendering plugins:
| Plugin | Gutenberg Compatibility | Ease of Use | Input Method | Render Fidelity |
|---|---|---|---|---|
| MathML Block (MathJax) | Native block + inline toolbar button. Live preview in editor. | Very easy – add MathML block or use “M” toolbar button for inline math. Paste LaTeX directly (use \[...\] for blocks). | Gutenberg Block (supports LaTeX in block); also inline via icon. | High – Renders via MathJax (vector font, excellent quality). |
| WP QuickLaTeX | No custom block (uses core blocks). Works in Gutenberg via Shortcode or Paragraph blocks. | Moderate – requires adding [latexpage] shortcode once per page (or enabling sitewide) and pasting LaTeX with $...$ or environments. No live preview in editor. | Shortcode block or direct text (LaTeX syntax in \$…\$). Parses on front-end. | High – Renders LaTeX to SVG images (crisp scaling). Fast, but relies on external service. |
| MathJax-LaTeX | No dedicated block, but works with Shortcode block or in text. | Moderate – wrap formulas in or use $$...$$ with an extra trigger. Preview requires page preview (no in-editor render). | Shortcode (auto-loads MathJax) or $...$ with a [mathjax] trigger. | High – Uses MathJax for client-side rendering (beautiful TeX output). Loads script only when needed. |
| KaTeX (Deprecated) | Had native block with live preview. (Plugin currently unavailable) | Easy – (When it was available) provided a KaTeX block for WYSIWYG editing. Also accepted [katex]...[/katex] shortcodes. | KaTeX Block; Shortcodes for inline/block. | High – Used KaTeX (very fast, high-quality). Plugin was popular for its dynamic preview but was closed in 2024. |
(All of the above support advanced LaTeX notation like fractions, subscripts, Greek symbols, etc., so formulas like \$R_{in} = \frac{\Delta U}{\Delta I}\$ will render correctly. Ensure you escape % as \% in LaTeX to avoid issues.)
Installing and Using the MathML Block Plugin (Recommended)
Using MathML Block is one of the most seamless ways to paste formulas from ChatGPT into Gutenberg. Here’s how to set it up and use it:
- Install the plugin: In your WordPress dashboard, go to Plugins → Add New and search for “MathML Block”. Install and Activate the plugin. (It requires WordPress 5.0+; compatible with modern Gutenberg editor.)
- Add a MathML block: Open the post or page where you want to add math. Click the “+” button to add a new block, search for “MathML”, and insert the MathML block. This block will show a text area for your formula.
- Paste your LaTeX formula: Click inside the MathML block’s text area and paste the formula text from ChatGPT. Surround the formula with
\[ ... \]for display equations (or use\( ... \)for inline equations). For example, paste:
\[ R_{in} = \frac{\Delta U}{\Delta I} \]
The block will immediately render the formatted equation in the editor (thanks to MathJax). You can edit the LaTeX code in place if needed – the preview updates live.
- Inline formulas (optional): If you need a formula within a text paragraph, you can still use the MathML Block plugin’s inline feature. Type the formula in a Paragraph block, select the formula text, and click the “M” math icon in the block toolbar. This will convert the selected text into an inline math span. (Ensure the formula is written in LaTeX syntax when you do this, e.g.
SoH = \frac{Q_{\max,current}}{Q_{\max,new}} \times 100\%with proper backslashes.) - Avoid formatting issues: When pasting LaTeX from ChatGPT, it’s best to paste as plain text (to avoid any hidden formatting) or paste into the Code Editor view of Gutenberg. This prevents WordPress from altering characters like backslashes. In Gutenberg, you can switch a block to “Edit as HTML” (for a Paragraph) before pasting – or just use the MathML block which is designed for code input. The goal is to preserve all symbols (e.g.
\Delta,_,\frac{}) exactly as given. - Preview and publish: Click the Preview button to verify that the math displays correctly on the front-end. The MathML Block plugin uses MathJax to render the formula on your live site exactly as you see it in the editor. Once satisfied, publish or update your post. Your formulas will appear beautifully typeset to readers.
Using the MathML block, you should be able to copy formulas from ChatGPT and paste them directly without any manual clean-up, as long as ChatGPT provides them in proper LaTeX format. The fractions, subscripts, and special characters will all render nicely.
Pro Tip: The MathML Block plugin supports LaTeX commands, so you don’t actually need to know MathML. Just use LaTeX math between
\[...\]or$...$and MathJax will handle it. For instance, the block will understand\times 100\%and render the percent sign properly.
Alternative Plugin Workflows (QuickLaTeX or MathJax-LaTeX)
If you choose an alternative plugin, the workflow will be a bit different:
- WP QuickLaTeX: Install and activate WP QuickLaTeX. In your post, add a Shortcode block at the top with
[latexpage](to enable processing). Then you can paste LaTeX anywhere in your content (e.g. in Paragraph blocks) using$inline$or\[display\]math delimiters. On preview or publish, the plugin will replace those with rendered SVG images. Note: There’s no live preview in the editor; you’ll see the results on the front-end after saving. This plugin is very powerful (supports{equation}environments, TikZ diagrams, etc.), but make sure the LaTeX is exact – e.g. include\%for percentages, and if using\begin{equation}…\end{equation}, keep the[latexpage]tag on that page. - MathJax-LaTeX: Install and activate MathJax-LaTeX. When editing, wrap each formula in the
shortcode (you can use a Shortcode block or even directly in a Paragraph block). For example:. Each such shortcode will display the rendered formula on your site using MathJax. If you prefer using$...$or$$...$$in the text, remember to include a[mathjax]shortcode somewhere in the post to load the engine (or simply also include onesomewhere, which triggers it automatically). MathJax-LaTeX won’t show a preview inside Gutenberg, but once you preview the page, the math is rendered with high quality. This plugin is a good choice if you like using standard TeX delimiters in your writing. According to a recent user, it “just works” in 2025 by simply writing equations in$$...$$and letting the plugin handle it.
Both of the above methods allow direct pasting of LaTeX from ChatGPT as long as the output from ChatGPT is pure LaTeX code. They eliminate the need to manually adjust formatting — the key is picking one method and sticking to the required syntax (shortcodes or dollar signs).
Getting ChatGPT to Output LaTeX-Ready Formulas
Finally, to make the process seamless, you can instruct ChatGPT to give you formulas in copy-ready LaTeX format. Here’s a sample prompt:
Sample ChatGPT Prompt: “Explain the concept of internal resistance and state of health for a battery, including the formulas for each. Please format all mathematical formulas as LaTeX (for example, write the internal resistance formula as
$R_{in} = \frac{\Delta U}{\Delta I}$and use\%for any percentages). I will be copying your response into WordPress, so the equations should be in proper LaTeX syntax without any extra markdown.”
This prompt tells ChatGPT exactly how to format the math. The assistant’s answer should then contain LaTeX-snippet formulas (enclosed in $...$ or $$...$$) that you can copy and paste directly into WordPress. For instance, ChatGPT might respond with something like:
- “Internal resistance (\$R_{in}\$) is defined by the formula \$R_{in} = \frac{\Delta U}{\Delta I}\$, where \$\Delta U\$ is the change in voltage and \$\Delta I\$ is the change in current.
- State of Health (SoH) is given by \$SoH = \frac{Q_{\max,\text{current}}}{Q_{\max,\text{new}}} \times 100%\$, indicating the current max battery capacity \$Q_{\max,\text{current}}\$ as a percentage of the new battery’s capacity \$Q_{\max,\text{new}}\$.”
Because the formulas are in LaTeX with proper delimiters and escaped characters, you can paste them into your Gutenberg editor with the chosen plugin active, and they will render correctly without any clean-up.
References:
- MathML Block plugin page – Description of using MathML block and inline math (MathJax engine); usage example with LaTeX code in block; plugin supports LaTeX syntax in MathML block.
- WP QuickLaTeX plugin page – Notes on pasting LaTeX directly with
$...$or\[...\]and using[latexpage]; features like no need for explicit
usage and alternative delimiters; MathJax on-demand loading for performance; recent confirmation of functionality in 2025. Tongfamily Tech Blog (2022) – Discussion of WP math plugins; notes that KaTeX plugin offered a Gutenberg block with live preview, QuickLaTeX was older and possibly giving image issues, and MathJax-LaTeX supported inline shortcodes. (KaTeX plugin was later removed from WordPress.org in 2024.)WordPress.com LaTeX Support – Illustrates using in a Shortcode or HTML block to render an equation (Jetpack/WordPress.com method).