MathJax config – how to make left alignment in Anki?

I recently updated my Anki from version 2.1.35 (which uses MathJax 2.7) to version 23.12.1 (which uses MathJax 3). In Anki 2.1.35 I had the following simple line in my Front Template:

<script>
MathJax.Hub.Config({
    # some code unrelated to my question
    displayAlign: "left"
});
MathJax.Hub.Configured();
</script>

This script aligned all MathJax diplaystyle equtions (they use delimiters \[ and \]) to the left (instead of the center alignment that was used by default).

My question is how to make such left alignment in Anki 23.12.1 (which uses MathJax 3)?

I tried the following code:

<script>
MathJax.config.chtml = {
    displayAlign: "left"
};

if (typeof is_already_run == 'undefined') {
  is_already_run = true
  MathJax.startup.getComponents();
}
</script>

This script made left alignment but it broke the rendering:
anki_2024-02-25_11-46-26

This is how this formula \[\sin(x) + \cos(x)\] looks like without using my script (default center alignment, the rendering is correct):
anki_2024-02-25_11-48-35

So, I need to fix my script somehow…

Use

<script>
MathJax.config.chtml['displayAlign'] = 'left'
if (typeof is_already_run == 'undefined') {
  is_already_run = true
  MathJax.startup.getComponents();
}
</script>

Something (maybe) irrelevant but I’m curious. When I use

<script>
MathJax.config.chtml = {
   ... // Even is empty
}
if (typeof is_already_run == 'undefined') {
  is_already_run = true
  MathJax.startup.getComponents();
}
</script>

The console threw an error.

And I checked the HTML code.

However it’s another value in the right code.

Due to my poor knowledge on HTML and JavaScript, I can’t explain why.

2 Likes

Great, your first script works! Thanks a lot!

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.