-
블로그에서 수식 입력하기 (MathJax)기타 2020. 4. 22. 12:35
※ 아래 기술된 방법으로 수식 입력을 제대로 해도 모바일 환경에서 수식이 깨지는 경우들을 확인했습니다.
이는 모바일 웹으로 자동으로 변환해주는 과정에서 MathJax 스크립트가 제대로 넘어가지 않아서 생기는 문제로 파악되며, 티스토리 설정에서 모바일웹 자동 연결을 사용하지 않음으로 바꾸면 해결됩니다.
MathJax Project MathJax project는 웹상에서 양질의 과학적 콘텐츠 생산을 목적으로 American Mathematical Society (AMS)와 Society for Industrial and Applied Mathematics (SIAM)의 지원을 받아 시작된 오픈소스 프로젝트이다.
이 프로젝트는 다음과 같은 목표를 가지고 있으며, 직접 써본 결과 수식 입력이 매우 편리하다.
- High-quality display of mathematics notation in all browsers
- No special browser setup required.
- An extensible, modular design with a rich API for easy integration into web applications.
Wordpress 같은 블로그 플랫폼에서는 MathJax를 블로그 설정에서 플러그인으로 선택하여 적용할 수 있는 것 같다. 아직 티스토리에서는 플러그인으로 지원을 해주지 않아 직접 HTML 코드를 편집해줘야 한다.
1. 먼저 [티스토리 설정] → [꾸미기] → [스킨 편집]에 들어간다
2. 왼쪽 상단의 드롭 다운 메뉴를 눌러 [글]을 선택한다.
3. [html 편집]을 들어간다.
4. 브라우저에 직접 내용이 표시되지는 않지만, 페이지의 메타데이터들이 저장되는 곳인 <head>와 </head> 사이에 아래 코드를 붙여넣으면 된다.
<script src="https://polyfill.io/v3/polyfill.min.js?features=es6"></script> <script id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"></script>이 코드는 MathJax의 버전에 상관없이 최신 버전을 사용하는 코드이다. 만일 특정 버전의 MathJax 사용을 원하거나 위 코드가 작동하지 않을 시 아래 MathJax 홈페이지의 Getting Started 문서를 확인해보면 되겠다.
https://www.mathjax.org/#gettingstarted
MathJax
Beautiful math in all browsers.
www.mathjax.org
5. 이제 티스토리 글쓰기 기본모드에서 수식을 입력할 수 있다. 문법은 LaTeX 문법과 동일하다.
인라인 수식 입력을 위해서는
[입력]
이렇게 \(x^2\)가 나온다.[출력]
이렇게 \(x^2\)가 나온다
수식을 독립적인 한 줄로 입력하려면
[입력]
$$x^2$$[출력]
$$x^2$$
6. LaTeX 수식을 작성하는 문법은 아래 사이트들을 참고하자.
https://www.codecogs.com/latex/eqneditor.php
Online LaTeX Equation Editor - create, integrate and download
Type your equation in this box
www.codecogs.com
https://www.calvin.edu/~rpruim/courses/s341/S17/from-class/MathinRmd.html
Mathematics in R Markdown
www.calvin.edu