[기타] 티스토리 기초 설정

1. 개요

이 블로그의 특성상 수식과 코드를 읽기 좋게 표현하는 기능이 필요하다. 스킨을 바꿀 때마다 다른 블로그를 참고하는 것이 쉽지 않아 따로 정리해둔다.

2. 티스토리 기초 설정

수식은 MathJax를 사용한다. 아래의 CDN을 html/css에 덧붙인다. 단, id는 제외한다. 코드에는 id가 없는데 렌더링 후 나타는 것으로 보아 SyntaxHighlighter의 버그로 보인다.

?

1	<script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-AMS_HTML" id=""></script>

코드는 SyntaxHighlighter를 사용한다. 제작자의 블로그나 이 페이지에서 파일을 받고 js파일과 css파일을 티스토리 html/css에 등록한다. syntaxhighlighter_3.0.83.zip 그리고 아래 스크립트를 html/css에 덧붙인다.

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22

<script type="text/javascript" src="./images/shCore.js"></script> <script type="text/javascript" src="./images/shLegacy.js"></script> <script type="text/javascript" src="./images/shBrushBash.js"></script> <script type="text/javascript" src="./images/shBrushCpp.js"></script> <script type="text/javascript" src="./images/shBrushCSharp.js"></script> <script type="text/javascript" src="./images/shBrushCss.js"></script> <script type="text/javascript" src="./images/shBrushDelphi.js"></script> <script type="text/javascript" src="./images/shBrushDiff.js"></script> <script type="text/javascript" src="./images/shBrushGroovy.js"></script> <script type="text/javascript" src="./images/shBrushJava.js"></script> <script type="text/javascript" src="./images/shBrushJScript.js"></script> <script type="text/javascript" src="./images/shBrushPhp.js"></script> <script type="text/javascript" src="./images/shBrushPlain.js"></script> <script type="text/javascript" src="./images/shBrushPython.js"></script> <script type="text/javascript" src="./images/shBrushRuby.js"></script> <script type="text/javascript" src="./images/shBrushScala.js"></script> <script type="text/javascript" src="./images/shBrushSql.js"></script> <script type="text/javascript" src="./images/shBrushVb.js"></script> <script type="text/javascript" src="./images/shBrushXml.js"></script> <link type="text/css" rel="stylesheet" href="./images/shCore.css"> <link type="text/css" rel="stylesheet" href="./images/shThemeDefault.css"> <script type="text/javascript">SyntaxHighlighter.all();</script>

일부 포스팅에는 3D plot이 적용되었고 Plotly를 사용한다. 아래의 CDN을 추가한다.

?

1	<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>