Skip to content

ongchi/wagtail-katex

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

32 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

PyPI Package Version Python Version Wagtail Version License

Math typesetting for Wagtail CMS powered by KaTeX.

This package is forked from gatensj/wagtail-draftail-katex.
This package contains svg icon from Font Awesome, which is licensed under the CC BY 4.0 License.

KaTeX Editor Screenshot

Quick Start

Installation

Install the package using the following command:

pip install wagtail-katex

Add wagtailkatex to the INSTALLED_APPS section in your settings.py file:

INSTALLED_APPS = [
    ...
    "wagtailkatex",
    ...
]

Add RichTextField to your page model, then you should find the math typesetting icon in the toolbar of rich-text editor in Wagtail admin views.

Template rendering

Add required assets to your page template:

{% load wagtailkatex %}

<link rel="stylesheet" href="{% wagtailkatex_media 'css' %}" />
<script src="{% wagtailkatex_media 'js' %}"></script>
<script src="{% static 'wagtailkatex/wagtailkatex-template.js' %}"></script>

The page content contains KaTeX embed should render properly.

Config

The KaTeX library is linked directly to a CDN distribution by default. If you want to change to the nearby server, the path could be specified in the settings.py file:

WAGTAILKATEX_SETTINGS = {
    "js": [
        "https://cdn.jsdelivr.net/npm/katex@0.16.10/dist/katex.min.js",
        "https://cdn.jsdelivr.net/npm/katex@0.16.10/dist/contrib/auto-render.min.js",
    ]
    "css": [
        "https://cdn.jsdelivr.net/npm/katex@0.16.10/dist/katex.min.css"
    ],
}

Alternatively, you can make your own copy in the static folder and serve it as Django static files:

WAGTAILKATEX_SETTINGS = {
    "js": [
        "my_app/katex.min.js",
        "my_app/auto-rdner.min.js",
    ],
    "css": [
        "my_app/katex.min.css"
    ],
}