LaTeX Equations not Rendering

Using Ghost
1

Hey there!

Whenever I click on my posts that I shared on Twitter or LinkedIn for example, the equations are never rendered properly. Has anyone found a solution to this already?

It looks like this. . .

IMG_5734
IMG_57341125Ă—1156 121 KB

I am also using this snippet in terms of code injection.

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.16.0/dist/katex.css" crossorigin="anonymous">
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.0/dist/katex.js" crossorigin="anonymous"></script>
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.0/dist/contrib/auto-render.min.js" crossorigin="anonymous" onload="renderMathInElement(document.body);"></script>

Anyone got an idea?
2

Can you share a link to the original post?

When you click on the link from Twitter/LinkedIn, are you on mobile? Which browser are you using?

3

Hey there!

This is the piece: A Basic Derivation of the Finite Element Method (FEM)

Yes, I am on mobile and I am using the browser version that’s opening on Instagram/Instagram/Twitter - and even when I say “open in Browser” it will not render the equations.

Try it with the LinkedIn post: Jousef Murad on LinkedIn: A Basic Derivation of the Finite Element Method (FEM)

Hope you can help!

Jousef

4

Thanks for following up. It looks like the AMP link (which is a format used to improve performance) is being used. AMP is very strict when it comes to JS, so it won’t allow your LaTex script to run, which is why the format is off.

The easiest solution here is to turn off AMP. The option is under Settings > Integrations > AMP. While AMP was once somewhat important for performance and SEO, the benefits have drastically waned in recent years, and most of the time nothing at all…

1 Like
5

That seemed to work, cheers Ryan!

1 Like