Enhanced KaTeX Configuration for Open WebUI (related to bug #3930) #1638

New Issue

GiteaMirror · 2025-11-11T14:48:57-06:00

GiteaMirror commented

2025-11-11 14:48:57 -06:00

Originally created by @rssrcr on GitHub (Jul 30, 2024).

I propose the integration and enhancement of KaTeX within the Open WebUI project to address bug #3930. This feature aims to provide users with a more flexible and robust configuration for rendering mathematical expressions.

Proposed Changes:

Support for Multiple Delimiters:
- Allow the use of both dollar signs ($ for inline and $$ for display) and LaTeX-style delimiters ($ and $ for inline, \[ and \] for display). This will enhance user experience by accommodating different LaTeX usage preferences.
Equation Environment:
- Introduce support for the LaTeX equation environment using \begin{equation} and \end{equation}. This feature will enable users to write numbered equations easily, improving the clarity and organization of mathematical content.
Configuration Example:
- Provide a sample configuration that demonstrates how to set up KaTeX with the proposed delimiters and equation environment. This will serve as a guide for users to implement the changes effectively.

Benefits:

This enhancement will resolve the current limitations faced by users regarding mathematical rendering in the Open WebUI, making it more versatile and user-friendly.
By supporting multiple delimiters and the equation environment, users will have greater flexibility in how they present mathematical content, catering to a wider range of use cases.

I believe that these improvements will significantly enhance the functionality of the Open WebUI project and look forward to the community's support in implementing this feature.

Originally created by @rssrcr on GitHub (Jul 30, 2024). I propose the integration and enhancement of KaTeX within the Open WebUI project to address bug #3930. This feature aims to provide users with a more flexible and robust configuration for rendering mathematical expressions. **Proposed Changes:** 1. **Support for Multiple Delimiters:** - Allow the use of both dollar signs (`$` for inline and `$$` for display) and LaTeX-style delimiters (`$` and `$` for inline, `\[` and `\]` for display). This will enhance user experience by accommodating different LaTeX usage preferences. 2. **Equation Environment:** - Introduce support for the LaTeX equation environment using `\begin{equation}` and `\end{equation}`. This feature will enable users to write numbered equations easily, improving the clarity and organization of mathematical content. 3. **Configuration Example:** - Provide a sample configuration that demonstrates how to set up KaTeX with the proposed delimiters and equation environment. This will serve as a guide for users to implement the changes effectively. **Benefits:** - This enhancement will resolve the current limitations faced by users regarding mathematical rendering in the Open WebUI, making it more versatile and user-friendly. - By supporting multiple delimiters and the equation environment, users will have greater flexibility in how they present mathematical content, catering to a wider range of use cases. I believe that these improvements will significantly enhance the functionality of the Open WebUI project and look forward to the community's support in implementing this feature. ![ksnip_20240730-125816](https://github.com/user-attachments/assets/e35b918e-ac47-4060-9dfd-1299dc56c701)

GiteaMirror closed this issue

2025-11-11 14:48:57 -06:00

GiteaMirror commented

2025-11-11 14:48:58 -06:00

@rssrcr commented on GitHub (Jul 30, 2024):

I believe Perplexity.ai uses the same strategy. Very effective IMHO.

@rssrcr commented on GitHub (Jul 30, 2024): I believe Perplexity.ai uses the same strategy. Very effective IMHO.

GiteaMirror commented

2025-11-11 14:48:58 -06:00

@rssrcr commented on GitHub (Jul 30, 2024):

Here's all the code you need:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>KaTeX Multiple Delimiters with Equation Environment</title>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.13.11/dist/katex.min.css">
    <script defer src="https://cdn.jsdelivr.net/npm/katex@0.13.11/dist/katex.min.js"></script>
    <script defer src="https://cdn.jsdelivr.net/npm/katex@0.13.11/dist/contrib/auto-render.min.js"
            onload="renderMathInElement(document.body, {
                delimiters: [
                    {left: '$$', right: '$$', display: true},
                    {left: '\\(', right: '\\)', display: false},
                    {left: '\\[', right: '\\]', display: true},
                    {left: '\\begin{equation}', right: '\\end{equation}', display: true},
                    {left: '$', right: '$', display: false}
                ]
            });"></script>
</head>
<body>
    <h1>KaTeX Multiple Delimiters with Equation Environment</h1>
    <p>Here is an inline equation using dollar signs: $ E = mc^2 $</p>
    <p>Here is an inline equation using LaTeX delimiters: \(\ E = mc^2 \)</p>
    <p>And here is a displayed equation using dollar signs:</p>
    <p>
        $$
        \int_0^\infty e^{-x^2} \, dx = \frac{\sqrt{\pi}}{2}
        $$
    </p>
    <p>And here is a displayed equation using LaTeX delimiters:</p>
    <p>
        \[
        \int_0^\infty e^{-x^2} \, dx = \frac{\sqrt{\pi}}{2}
        \]
    </p>
    <p>Here is an equation environment:</p>
    <p>
        \begin{equation}
        E = mc^2
        \end{equation}
    </p>
</body>
</html>

@rssrcr commented on GitHub (Jul 30, 2024): Here's all the code you need: ```html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>KaTeX Multiple Delimiters with Equation Environment</title> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.13.11/dist/katex.min.css"> <script defer src="https://cdn.jsdelivr.net/npm/katex@0.13.11/dist/katex.min.js"></script> <script defer src="https://cdn.jsdelivr.net/npm/katex@0.13.11/dist/contrib/auto-render.min.js" onload="renderMathInElement(document.body, { delimiters: [ {left: '$$', right: '$$', display: true}, {left: '\$', right: '\$', display: false}, {left: '\\[', right: '\\]', display: true}, {left: '\\begin{equation}', right: '\\end{equation}', display: true}, {left: '$', right: '$', display: false} ] });"></script> </head> <body> <h1>KaTeX Multiple Delimiters with Equation Environment</h1> <p>Here is an inline equation using dollar signs: $ E = mc^2 $</p> <p>Here is an inline equation using LaTeX delimiters: $\ E = mc^2 $</p> <p>And here is a displayed equation using dollar signs:</p> <p> $$ \int_0^\infty e^{-x^2} \, dx = \frac{\sqrt{\pi}}{2} $$ </p> <p>And here is a displayed equation using LaTeX delimiters:</p> <p> \[ \int_0^\infty e^{-x^2} \, dx = \frac{\sqrt{\pi}}{2} \] </p> <p>Here is an equation environment:</p> <p> \begin{equation} E = mc^2 \end{equation} </p> </body> </html> ```

GiteaMirror commented

2025-11-11 14:48:59 -06:00

@rssrcr commented on GitHub (Jul 30, 2024):

@tjbck, can I ask why it was closed?

@rssrcr commented on GitHub (Jul 30, 2024): @tjbck, can I ask why it was closed?