블로그 수식 입력, mathjax 모바일 깨짐 해결방법

Posted by wbpark

2017. 6. 30. 05:00 기타

-------

2023.12.28. 내용추가

티스토리 블로그 설정 내

[ 꾸미기 > 스킨편집 > HTML] 에서

<head> ... </head> 부분을 찾고, 해당 head 테그 사이에

아래의 script 테그를 추가해주시면 수식 깨짐 문제가 해결됩니다.

출처 : https://faceyourfear.tistory.com/76

티스토리(tistory) 모바일에서 LaTex 수식 깨짐 해결

수학 공부한 내용을 정리하거나, 논문 리뷰할 때 수식이 많이 나와 LaTex을 이용해서 블로그에 정리를 하곤 한다. 그런데 pc버전은 아무 문제가 없는데, 모바일 버전에서는 아래와 같이 내가 쓴 LaT

faceyourfear.tistory.com

---------

2017.06.30. 내용

이제 막 블로그를 시작한 초보로서, 방금 큰 고비 하나를 넘겼습니다.

바로 모바일에서 mathjax 수식이 깨지는 현상을 해결한 것입니다.

결론부터 말하면, 티스토리에 모바일 웹을 off 해놓지 않아 생긴 문제입니다. 모바일 웹이 적용될 경우 스크립트가 제대로 적용되지 않아 수식이 깨진 겁니다. PC에서는 수식이 제대로 표현되는데, 모바일 기기에서만 문제가 생긴다면 스크립트가 충돌한 것이 없는지 한번쯤 확인해보시길 바랍니다.

필자와 같이 html이나 css에 대해 잘 모르는 분들을 위해 블로그에 mathjax를 적용하는 방법과 모바일웹을 해제하는 방법에 대해 글을 씁니다.

1. 티스토리 블로그 수식 입력

[관리] -> [ HTML / CSS 편집 ] -> [html] 설졍에서 <head>와 </head> 사이에 아래의 코드를 붙여넣습니다.

이 방법은 블로그 내에 latex 코드를 입력하면 mathjax를 통해 수식으로 읽어오는 것입니다.

출처 : https://www.mathjax.org

<script type="text/javascript" src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML">

MathJax.Hub.Config({

extensions: ["tex2jax.js","TeX/AMSmath.js","TeX/AMSsymbols.js"],

jax: ["input/TeX", "output/HTML-CSS"],

tex2jax: {

inlineMath: [ ['$','$'], ["\$","\$"] ],

},

"HTML-CSS": { availableFonts: ["TeX"] }

});

</script>