A Summernote plugin to enable LaTeX rendering and editing within the Summernote WYSIWYG editor. This plugin integrates MathJax for rendering mathematical expressions, allowing users to include and edit LaTeX code seamlessly.

• Add and edit LaTeX equations directly within Summernote.
• Render equations with MathJax for accurate mathematical display.
• Toolbar integration for easy access to the LaTeX editor.

Test drive the demo

1. Include the required dependencies in your HTML file:

   • jQuery
   • Bootstrap
   • Summernote
   • MathJax

2. Add the summernote-latex.js plugin file to your project.

3. Include the plugin in your project:

   <script src="summernote-latex.js"></script>

• Initialize Summernote with the LaTeX plugin:

  $('#summernote').summernote({
      placeholder: 'Type your content here...',
      tabsize: 2,
      height: 300,
      toolbar: [
          ['style', ['style']],
          ['font', ['bold', 'underline', 'clear']],
          ['color', ['color']],
          ['para', ['ul', 'ol', 'paragraph']],
          ['table', ['table']],
          ['insert', ['link', 'picture', 'video', 'latex']],
          ['view', ['fullscreen', 'codeview', 'help']]
      ]
  });

• Use the latex button in the toolbar to open the LaTeX editor.

• Enter LaTeX equations such as:

  \frac{3}{5}+\frac{1}{5}
  x^n + y^n = z^n
  \sqrt{x^2+1}

• Equation size configurable with

<style>
.MathJax_Exp 
{
    font-size: 45px;
}
</style>

• jQuery 3.5.1 or higher
• Bootstrap 3.4.1
• Summernote 0.9.0
• MathJax 2.7.7

Customize the MathJax settings by modifying the script source:

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.7/MathJax.js?config=TeX-MML-AM_CHTML"></script>

This project is licensed under the MIT License.

Contributions are welcome! Feel free to open issues or submit pull requests on the GitHub repository.

• Summernote
• MathJax