티스토리 수식 입력하기 : LaTeX

  안녕하세요. 오늘은 티스토리 블로그에서 수식을 입력하는 방법을 간단하게 설명하겠습니다. 티스토리에서 수식을 작성하려면 먼저 HTML 코드를 추가하고, 수식의 표현을 변환해 주는 사이트에서 해당 수식을 입력한 후, 쓰고자 하는 글에서 $기호를 활용하여 작성할 수 있습니다. 해당 내용들을 자세히 다뤄보겠습니다.

 

1. 입력 준비 : HTML 코드 추가하기

  수식을 입력하기 앞서 HTML 에서 코드를 추가해야 합니다.

  먼저, 티스토리 관리 페이지에서 [스킨 편집]에 들어갑니다.

  그다음, html 편집에 들어갑니다.

  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>
<script>
window.MathJax = {
  tex: {
    inlineMath: [['$', '$'], ['\\(', '\\)']]
  }
};
</script>

  이 코드는 MathJax라는 라이브러리를 사용하여 웹페이지에서 수학 기호와 수식을 랜더링 하는 스크립트입니다. LaTex 형식의 수식을 HTML 페이지에서 표현하는 데 사용됩니다. 내용은 복잡할 수 있지만 복사한 코드를 붙여넣기한 후 저장을 하면, 수식을 입력할 준비가 되었습니다.

 

2. 수식 입력 방식 : LaTex 형식

  이제는 수식을 입력하기 위해 어떤 식으로 작성해야하는지 알아보겠습니다. 원하는 수식을 아래 링크를 들어가서 수식을 입력합니다. 

https://editor.codecogs.com/

Equation Editor for online mathematics - create, integrate and download

  저번 블로그에서 사용했던 수식으로 설명해보겠습니다.

  링크에 접속하면 위와 같은 화면이 나오고 위쪽에 있는 기호들을 사용하여 수식을 작성하며, 아래 결과창을 보면서 원하는 결과가 나오는지 확인합니다. 그리고 수식이 완성되면 위에 입력된 J(\theta) = \frac{1}{2n} \sum_{i=1}^{n} (h_{\theta}(x^{(i)}) - y^{(i)})^2 부분을 복사합니다.

 

3. 티스토리 글에 입력하기

  수식을 입력하는 방식은 두 가지가 있습니다. 인라인 수식과 블록 수식이 있으며, 인라인 수식은 수식을 텍스트 줄 안에 표시하고 싶을 때, $사이에 입력을 합니다. 블록 수식은 수식을 별도의 줄에서 가운데 정렬을 하여 수식을 표현할 수 있습니다. 표현 방법은 $$를 사용하면 됩니다.

<입력 예시 : 인라인 수식>

$ J(\theta) = \frac{1}{2n} \sum_{i=1}^{n} (h_{\theta}(x^{(i)}) - y^{(i)})^2 $

 

<입력 예시 : 블록 수식>

$$ J(\theta) = \frac{1}{2n} \sum_{i=1}^{n} (h_{\theta}(x^{(i)}) - y^{(i)})^2 $$