Skip to content

Instantly share code, notes, and snippets.

@cycomachead
Last active January 4, 2019 06:47
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save cycomachead/e388ec65269e2e9adf95d0eae5bfc418 to your computer and use it in GitHub Desktop.
Save cycomachead/e388ec65269e2e9adf95d0eae5bfc418 to your computer and use it in GitHub Desktop.
Really Basic KaTeX Discourse Theme

This is a really simple KaTeX theme component for Discourse.

It stuffs all the necessary bits at the end of </head>. It loads all KaTeX and CSS (currently v0.10.0) from the jsdelivr CDN. It then uses the Discourse theme API api.decorateCooked to update the content of posts.

NOTE: I have deviated from the default KaTeX and use the delimeters $$ for inline LaTeX and $$$ for block LaTeX. But you can edit the options of the KaTeX function pretty easily from the theme editor.

{"theme":{"id":7,"name":"KaTeX","created_at":"2019-01-04T06:41:29.393Z","updated_at":"2019-01-04T06:41:29.393Z","component":true,"color_scheme":null,"color_scheme_id":null,"user_selectable":false,"remote_theme_id":null,"user":{"id":2,"username":"cycomachead","avatar_template":"/user_avatar/forum.snap.berkeley.edu/cycomachead/{size}/15_2.png","title":"Snap! Developer"},"theme_fields":[{"name":"head_tag","target":"common","value":"\u003clink rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/npm/katex@0.10.0/dist/katex.min.css\" integrity=\"sha384-9eLZqc9ds8eNjO3TmqPeYcDj8n+Qfa4nuSiGYa6DjLNcv9BtN69ZIulL9+8CqC9Y\" crossorigin=\"anonymous\"\u003e\n\u003cscript defer src=\"https://cdn.jsdelivr.net/npm/katex@0.10.0/dist/katex.min.js\" integrity=\"sha384-K3vbOmF2BtaVai+Qk37uypf7VrgBubhQreNQe9aGsz9lB63dIFiQVlJbr92dw2Lx\" crossorigin=\"anonymous\"\u003e\u003c/script\u003e\n\u003cscript defer src=\"https://cdn.jsdelivr.net/npm/katex@0.10.0/dist/contrib/auto-render.min.js\" integrity=\"sha384-kmZOZB5ObwgQnS/DuDg6TScgOiWWBiVt0plIRkZCmE6rDZGrEOQeHM5PcHi+nyqe\" crossorigin=\"anonymous\"\u003e\u003c/script\u003e\n\u003cscript type=\"text/discourse-plugin\" version=\"0.8\"\u003e\n console.log(Discourse);\n api.decorateCooked(function(elm) {\n console.log('decorate cooked');\n console.log(elm)\n })\n $(document).ready(function() {\n renderMathInElement(document.body, {\n delimiters: [\n {left: \"$$$\", right: \"$$$\", display: true},\n {left: \"$$\", right: \"$$\", display: false},\n ]\n });\n });\n\u003c/script\u003e","type_id":0}],"remote_theme":null}}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment