notion-inline-latex

UserScript for Inline LaTeX Rendering in notion.so

Feature

• Render LaTeX at Startup (default two seconds latency for smoother experience but customizable)
• Render LaTeX at Keyup (default two seconds latency for smoother experience but customizable)
• $ $ as Default LaTeX Delimiter (customizable)

Acknowledgement

• Special thanks go to Evert Heylen!
• • This project is influenced and motivated by his initial project, evertheylen/notion-inline-math.

Attention (Please read this before proceeding.)

• Script is intended only for web browswer use with UserScript extension, Violentmonkey.
• • The script should work with other UserScript extentions as it is or with minimum changes though it has not been tested yet.
• Script does not change the content.
• • It merely changes the display after the contents are loaded.
• For the script to work properly, you need at least one math block present in the page where you want to render inline LaTeX.
• This script is based on the script by Evert Heylen for my own math notes on notion.so.
• • I made it available for public so that it would be useful to others.
• • I meant no harm in writing this personal script.
• • I cannot take responsibility for loss of data or other harms.
• • So, even though the script only changes the display and it is harmless at my best knowledge, please use it at your own risk, especially with untested mobile installation/usage described below.
• Last but not least, this project/script is in no way affiliated nor sponsored by notion.so.
• • Like features on Notion Hacks, this is a personal/community hack/workaround.

Installation

• Install Violentmonkey.
• Click on the extension icon and click plus icon. A new text editor window by extension will be opened in new tab.
• Copy/paste the script notion-inline-latex.js.
• Save and close the editor.
• Go to notion.so and enable the script if it has not been already.

Usage

• It should work on any notion.so page automatically through extension as long as
• • the script is enabled in extension, and
• • there exists at least one math block in the page where you want to render inline LaTeX.
• If you have any usage question, you can ask me on either:
• • Unofficial NotionHacks Discord, or
• • Unofficial NotionHacks Slack.

Mobile Installation/Usage (Untested)

• Note: The workaround below has never been tested or tried out. Just an idea for those of you adventurous. Use with extreme caution!!!
• • Install a browser with plugin/extension support which has userscript plugin/extension available (For example, Opera with Tampermonkey).
• • Use the script with that plugin/extension.

Example to Test

Duplicatable Sample Notion Page

Known Limitations

• You need at least one math block present in the page where you want to render inline LaTeX.
• Render at startup will not work when the page is loaded dynamically within Notion. Quick fix is just click a neutral key like shift for render at keyup to pick up the keyup cue.

To-Do-List

• [ ] Figure out a way to eliminate the need for the presence of math block for the script to work.
• [ ] Figure out how to avoid cursor shifting to the beginning of the block after each render.

Customization

• Small value for startUpWaitTime and keyUpWaitTime can make the script load improperly.
• Add delimiters as desired though delimiters other than default one have not been tested yet.

Contribution

• Please start an issue if you find a bug or have any question.
• Please submit PR if you have any update to the project or would like to contribute. Thanks in advance!

Reference

• Official notion.so
• Official Notion Documentation
• Notion Community
• Notion Hacks
• evertheylen/notion-inline-math
• Violentmonkey Metadata Block
• StackOverFlow Answer to "Run javascript function when user finishes typing instead of on key up?"
• StackOverFlow Answer to "How can I render all inline formulas in $..$ with KaTeX?"
• KaTeX Auto-render Extension