자신의 blogger/blogspot에서 LaTex theorem-like environment 작성 가능하게 만들기 (mathjax)

수식 작성을 하다보면 간혹 theorem이라든가 lemma, proposition, definition 등은 논문에서 나오는 형식으로 이쁘게 구별이 되었으면 할 때가 있다. 그리고 앞에서 나온 Theorem에 숫자가 자동으로 붙으면 금상첨화!

The global minimum of the virtual training criterion $C(G)$ is achieved if and only if $p_g=g+{data}.$ At that point, $C(G)$ achieves the value $-log(4)$.

$\mathbb{E}_{x \sim p_{data}} \left[ -log(2)\right] + \mathbb{E}_{x \sim p_{g}} \left[ -log(2)\right]$

뭐 이런 식으로?

그럼 어떻게 해야 하는 지 확인해 보자;

1. blogger에 로그인 하고
2. 템플릿 설정에 들어간 후
3. 맞춤 설정을 클릭하고 
4. 사이드 바에서 고급을 클릭
5. CSS 추가로 들어가서 아래 내용을 추가해주면 끝난다. 

body
{
counter-reset: theorem;
counter-reset: definition;
}

.theorem {
    display: block;
    margin: 12px 0;
    font-style: italic;
    counter-increment: theorem
}
.theorem:before {
    content: "Theorem " counter(theorem) ".";
    font-weight: bold;
    font-style: normal;
}
.proposition {
    display: block;
    margin: 12px 0;
    font-style: normal;
    counter-increment: proposition
}
.proposition:before {
    content: "Proposition " counter(proposition) ".";
    font-weight: bold;
    font-style: normal;
}
.lemma {
    display: block;
    margin: 12px 0;
    font-style: italic;
    counter-increment: theorem;
}
.lemma:before {
    content: "Lemma " counter(theorem) ".";
    font-weight: bold;
    font-style: normal;
}
.proof {
    display: block;
    margin: 12px 0;
    font-style: normal;
}
.proof:before {
    content: "Proof.";
    font-style: italic;
}
.proof:after {
    content: "\25FC";
    float:right;
}
.definition {
    display: block;
    margin: 12px 0;
    font-style: normal;
    counter-increment: definition
}
.definition:before {
    content: "Definition " counter(definition) ".";
    font-weight: bold;
    font-style: normal;
}