기존 Tistory의 에디터가 바뀌면서 기존의 수식 편집기가 사라졌다. 이제는 Latex를 이용해서 수식을 넣으려면 html에 스크립트로 넣어야한다.
Latex를 모든 브라우저에서 수식을 표현하기 위해서는 MathJax에서 사용하는 JS 라이브러리 사용해서 문제를 해결하려 한다.
https://www.mathjax.org/
MathJax
Beautiful math in all browsers.
www.mathjax.org
1. Tistory 관리 > 꾸미기>스킨 편집> html 편집으로 이동


2. 작성한 페이지 마다 코드를 붙여 넣는 것이다.
<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>

3. 하단의 코드를 글 작성시 HTML 모드에서 붙여 넣는다.(모바일 최적화)
이 단계를 끝내야 모바일에서도 깨지지 않는다.
MathJax (현재 기준 최신 버전) version 3 코드를 입력해준다.
참고 링크: https://www.mathjax.org/#gettingstarted

<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>

HTML모드에서 다시 기본모드로 변경하면 하단과 같이 스크립트가 추가되어 있다.

4. 수식을 사용하기 위해서는 작성한 글에 문법에 맞추어 넣어 사용
4.1 문장 사이 삽입 가능
글과 수식을 한 줄에 쓰기 위해서는 \( 사용
식 \( y=ax\) 는 일차 함수의 한 형태이다.
식 \( y=ax\) 는 일차 함수의 한 형태이다.
4.2 문장 사이 삽입 불가
수식만 한 줄에 사용하기 위해서는 \[ , $$ 사용
가운데 정렬
식 \[ y=ax\] 는 일차 함수의 한 형태이다.
식 \[ y=ax\] 는 일차 함수의 한 형태이다.
식 $$y=ax$$ 는 일차 함수의 한 형태이다.
식 $$y=ax$$ 는 일차 함수의 한 형태이다.
모바일 환경에서도 장 적용됬다!

참고로 Latex문법이 익숙하지 않다면 해당 사이트에서 확인 가능하다.
https://latex.codecogs.com/eqneditor/editor.php
Online LaTeX Equation Editor - create, integrate and download
latex.codecogs.com

'Challenges > 티스토리' 카테고리의 다른 글
[Google Search Console] 구글서치콘솔 리디렉션 오류 원인, 한번에 해결 (14) | 2022.08.21 |
---|---|
[구글 애널리틱스 가이드] GA 기본 3 - 구글 에드센스, 구글 서치 콘솔 연동(블로그 방문자 유입 및 광고 고객 최적화하기) (0) | 2022.05.03 |
티스토리 네이버 웹마스터 도구/서치 어드바이저 등록, 검색 노출 (0) | 2021.09.11 |
[티스토리] 붙여넣기 및 이미지 업로드 중입니다 해결방법 (0) | 2021.08.08 |
[Google AdSense 구글 에드센스 ] 핀(PIN) 번호 입력하기 & 새 PIN 요청하기 (3) | 2021.07.25 |