소개 및 일상?

티스토리 모바일에서 수식 보이게 하는 법 - MathJax 서식 안될 때

juhongyee 2025. 2. 3. 00:49
반응형

서론

아무래도 이론 관련 지식을 다루는 블로그다 보니 수식을 작성할 일이 많습니다. 티스토리에서 수식을 적으려면 보통 LaTeX 문법을 사용합니다. 그런데 Markdown을 통해 수식을 적으면 데스크탑 환경에서는 수식이 잘 보이지만 모바일 환경에서는 깨져 보입니다.

 

이에 대한 일반적 해결책으로 서식에 MathJax 관련 HTML 코드를 넣어놓고 글마다 넣어주는 방법을 사용합니다.

그런데 어느 순간부터 저는 이게 잘 안되더라구요. 그래서 해결해 왔습니다!

 

본론

https://riagol.tistory.com/73

 

티스토리 수식 입력 (MathJax)

수식을 꽤 헤비하게 쓰는 편이라 수식입력 관련해서 많이 알아봤는데 정말 시행착오를 많이 겪었다. (사실 고집 때문이긴한데) 일단 결론부터 이야기하자면, 이 수식 두 줄을 스킨편집 → HTML 편

riagol.tistory.com

예전에는 위의 블로그의 방법대로 하면 됐었는데요. 어느 순간 기점으로 이 코드가 작동이 잘 안 되었습니다.

 

문제를 확인해 보니 \ (역슬래시) 문제였습니다. 원래 코딩에서 '\'를 치려면 \\를 입력해야 되는데요. 예전에는 무슨 이유인지 역슬래시 하나하나가 문자로 인식이 되었던 것 같더라구요.

 

하여튼 쓸데없는 설명이 길었네요. 하여튼 해결을 했습니다.

먼저는 위의 블로그의 방법대로 1. 관리 2. 서식관리 3. 서식 쓰기 4. HTML 모드 변경 을 해주시면 됩니다.

 

그리고 다음의 코드를 입력을 해주면 됩니다.

<p data-ke-size="size16">
<script src="https://polyfill.io/v3/polyfill.min.js?features=es6"></script>
<script> MathJax = { tex: {inlineMath: [['$', '$'], ['\\\\(', '\\\\)']]} }; </script>
<script src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"></script>
</p>

 

 

역슬래시를 4개를 써서 2개의 문자 역슬래시가 나오도록 수정했습니다.

 

위의 방법으로 작성한 서식을 아래와 같이 매번 글 위에 입력해 주면 됩니다.

요렇게 하세용 1번
요렇게 하세용 2번
요렇게 하세용 3번

결론

역슬래시 4개 쓰면 잘 되고! 그냥 설명 읽지 말고 코드 복붙해서 쓰세용 ㅎㅎ

 

다들 화이팅~