삶 가운데 남긴 기록 AACII.TISTORY.COM
티스토리 블로그에서 수학 수식 입력 방법 본문
티스토리 블로그에서 수학 기호를 LaTeX (레이텍) 문법을 이용해 입력할 수 있습니다.
먼저, 티스토리 관리화면에서 → 꾸미기 메뉴 → 스킨편집 메뉴 화면으로 이동합니다.
그러면 html 편집 버튼이 있는데 그 버턴을 누르고 <head> 태그의 맨 하단에 아래 스크립트를 추가로 복사해서 입력하시고 적용하면 됩니다.
<!-- 수학 수식 입력 스크립트 -->
<script type="text/x-mathjax-config">
MathJax.Hub.Config({
tex2jax: {inlineMath: [['$','$'], ['\\(','\\)']]}
});
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/latest.js?config=TeX-MML-AM_CHTML"></script>
그러면 블로그에서 아래처럼 LaTex 문법으로 입력하면
\[x^3\]
아래처럼 수학 수식으로 표시가 됩니다.
\[x^3\]
LaTeX(레이텍) 문법
LaTex 문법 입력:
$x^2 + y^2 = z^2$
$$\alpha + \beta = \gamma$$
위 입력이 아래처럼 화면에 수식으로 출력:
$\frac{a}{b}$
위 입력이 아래처럼 화면에 수식으로 출력:
- 거듭제곱 및 아래첨자: 위첨자는 ^, 아래첨자는 _를 사용합니다.
LaTex 문법 입력:
$a^2 + b_1$
위 입력이 아래처럼 화면에 수식으로 출력:
$a^2 + b_1$
- 그리스 문자: 영어 이름을 소문자로 쓰면 소문자, 첫 글자를 대문자로 쓰면 대문자가 됩니다.
LaTex 문법 입력:
$\pi$, $\Omega$
위 입력이 아래처럼 화면에 수식으로 출력:
$\pi$, $\Omega$
- 곱셈과 나눗셈
LaTex 문법 입력:
$a \times b$, $a \div b$
위 입력이 아래처럼 화면에 수식으로 출력:
$a \times b$, $a \div b$
- 제곱근
LaTex 문법 입력:
$\sqrt{x}$
위 입력이 아래처럼 화면에 수식으로 출력:
$\sqrt{x}$
자세한 LaTex 문법 참고:
모바일 환경 티스토리 블로그에서 LaTex 수식이 표시되지 않는 문제
PC 환경에서는 위 설정으로 수식들이 정상 표시되지만, 모바일 환경에서는 적용되지 않습니다.
이 문제에 대한 해결책으로 서식을 추가해서 모바일 대응용 MathJax 관련 스크립트를 추가해서 서식으로 저장한 후, 수식을 사용하는 게시물마다 해당 서식을 추가하는 방식으로 해결합니다.
역슬래시 escape 문자 처리 문제 때문에 발생하는 것으로 보입니다.
티스토리 블로그 관리 화면으로 가셔서
1. 관리화면 콘텐츠 메뉴
2. 서식관리 메뉴 선택
3. 서식관리 화면에서 서식 쓰기 버튼 클릭
4. 우측 상단 기본모드 selectbox를 선택해 HTML 모드 변경 후 서식 내용에 아래 코드를 입력해 줍니다.
<script> MathJax = { tex: {inlineMath: [['$', '$'], ['\\\\(', '\\\\)']]} }; </script>
<script src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"></script>
역슬래시 4개를 써서 2개의 문자 역슬래시가 나오도록 수정했습니다.
이 서식의 제목을 "모바일용 LaTex 적용 서식" 같은 제목으로 저장해 둡니다.
그리고 LaTex 수식을 사용할 게시물에서 해당 서식을 추가하하면 편집 화면에서 게시물에 아래처럼 스크립트가 추가되는데요.

이후 게시물에서 LaTex 수식들을 적게 되면 해당 수식들이 모바일 환경에서도 정상적으로 표시되게 됩니다.

'STUDY > Science & Mathematics' 카테고리의 다른 글
| Boolean Algebra (0) | 2024.05.10 |
|---|---|
| 진화론의 대표적인 오해들 (1) | 2023.08.10 |
| 수학이란 무엇일까요? 왜 현대 문명국가에서 필수로 가르칠까요? (0) | 2022.02.25 |
