안녕하세요~~ 저번시간에는 코드변환 사이트를 이용해 블로그에 코드를 넣는법을 알아봤습니다.
이번에는 SyntaxHighlighting 를이용하여 티스토리 게시물을쓸때 바로 html 을 조작하여 코드를 넣어보는 방법을 알아보겠습니다.
먼저 http://alexgorbatchev.com/SyntaxHighlighter/ 사이트로 이동하여 하이라이터를 다운로드 받아 줍니다!!
(위사이트에서 다운로드가 안되는거 같아서 파일첨부 합니다!)
syntaxhighlighter_3.0.83.zip압축을 풀면 나오는 파일중
스크립트와 스타일 폴더에 있는 모든파일을 자신의 블로그 html 에 등록하여 주면됩니다.
그리고 블로그 html 의 <head>부분에
<link rel=" stylesheet" =""="" type="text/css" href="./images/shCoreRDark.css">
을 추가해 줍니다 (코드 스타일을 지정할수 있습니다 저는 다크로...)
<body> 부분에는
<script type="text/javascript" src="./images/shCore.js"></script>
<script type="text/javascript" src="./images/shAutoloader.js"></script>
<script type="text/javascript" src="./images/shBrushAppleScript.js"></script>
<script type="text/javascript" src="./images/shBrushAS3.js"></script>
<script type="text/javascript" src="./images/shBrushBash.js"></script>
<script type="text/javascript" src="./images/shBrushColdFusion.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/shBrushErlang.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/shBrushJavaFX.js"></script>
<script type="text/javascript" src="./images/shBrushJScript.js"></script>
<script type="text/javascript" src="./images/shBrushPerl.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/shBrushPowerShell.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/shBrushSass.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>
<script type="text/javascript" src="./images/shLegacy.js"></script>
<script type="text/javascript"> SyntaxHighlighter.all(); </script>
브러쉬를 등록해 줍니다(코드의 스타일을 글쓸때 html에서 지정할수 있습니다.)
여기까지 하시고 저장하면 이제 글쓰기에서 html을 체크하신뒤
<pre class="brush: java">
/*여기에 코드내용*/
</pre>
저렇게 <pre>사이에 코드를 입력하게되면
/*여기에 코드내용*/이렇게 나오게 됩니다!!
<pre class=> 부분에서 자신의 코드스타일을 지정해주시면 됩니다(java 면 java c면 c 등등)
그리고 한가지 코드를 쓰는데에 있어서 코드안에 <와 > 문자가 들어가면 인식이 안되는 경우가 있습니다.. (xml 같은경우)
이런경우 <는 < 로 >는 > 로 변환해서 써주면 정상적으로 나오게 됩니다.
이상으로 티스토리에서 블로그에 코드를 넣는법을 알아보았습니다~~ 틀린부분이나 이상한부분이 있으면 알려주세요.
'기타' 카테고리의 다른 글
| [기타]Eclipse 설치하기(이클립스) (0) | 2017.11.16 |
|---|---|
| [티스토리]초대장 나눔(종료) (22) | 2017.11.02 |
| [기타]제4회 대한민국 SW융합 해카톤대회 참가후기 (0) | 2017.09.05 |
| [기타]2017정보처리기사 마지막 실기!! (0) | 2017.08.29 |
| [기타]블로그에 코딩소스 넣는법 (0) | 2017.08.09 |
