GitHub 블로그에서 마크다운 수학수식 사용하기

MathJax

오늘도 열심히 깃헙 블로그 공부! 😀😁

Jekyll Github 블로그에서 수학식을 표시하려면 MathJax를 사용해야하는 것을 알았다..!

MathJax 적용방법은 아래와 같습니다.

1. 마크다운의 엔진 변경.

_config.yml 파일의 내용중 # conversion 부분의 내용을 아래와 같이 수정한다.

# Conversion
markdown: kramdown
highlighter: rouge
lsi: false
excerpt_separator: "\n\n"
incremental: false

2. _includes 디렉토리에 mathjax_support.html 파일을 아래와 같은 내용으로 생성한다.

<script type="text/x-mathjax-config">
MathJax.Hub.Config({
    TeX: {
      equationNumbers: {
        autoNumber: "AMS"
      }
    },
    tex2jax: {
    inlineMath: [ ['$', '$'] ],
    displayMath: [ ['$$', '$$'] ],
    processEscapes: true,
  }
});
MathJax.Hub.Register.MessageHook("Math Processing Error",function (message) {
	  alert("Math Processing Error: "+message[1]);
	});
MathJax.Hub.Register.MessageHook("TeX Jax - parse error",function (message) {
	  alert("Math Processing Error: "+message[1]);
	});
</script>
<script type="text/javascript" async
  src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-MML-AM_CHTML">
</script>

3. _layout/default.html파일의 <head> 부분에 다음 코드를 삽입한다.

저는 <head> 에 이미 두줄의 코드가 있어서 제일 아래줄에 넣어주었습니다😁 !

{% if page.use_math %}
	{% include mathjax_support.html %}
{% endif %}

4. 수학식을 표시할 포스트의 front-matter에 use_math: true 적용하기

---
title:  'log  ln'
categories:
  - Math
tags: [Math]
use_math: true
---

5. 수식 테스트 해보기

$log_{10}x = logx$



적용 후에는 다음 페이지 처럼 기호표시가 적용된것을 볼 수 있다! => 확인하기!

처음엔 git에서 보았을 때 적용안되는줄 알았는데 블로그로 확인하면 수식이 적용된 것을 볼 수 있습니다.

참고

[1] https://mkkim85.github.io/blog-apply-mathjax-to-jekyll-and-github-pages/

댓글남기기