아는 분들은 다 아는 SyntaxHighlighter를 이용해서 블로그에 코드 이쁘게 넣는 방법!
1. http://alexgorbatchev.com/SyntaxHighlighter/ 접속
2. 우측 'download' 클릭하여 3.0.83 버전 다운로드
3. 아래 스크린샷과 같은 파일들이 나옵니다
4. 티스토리 꾸미기 -> HTML/CSS편집 -> 업로드
필수 업로드: shCore.css, shCore.js
언어 별 업로드: shBrush***.js
테마 업로드: shTheme****.css (기본 테마는 shThemeDefault.css)
5. 티스토리 꾸미기 -> HTML/CSS편집 -> HTML/CSS
skin.html 부분서 <head>와 </head> 사이에 아래의 내용을 추가시키면 완료
<!--SyntaxHighligher 시작-->
<link type="text/css" rel="stylesheet" href="./images/shCore.css"/>
<link type="text/css" rel="stylesheet" href="./images/shThemeDefault.css"/>
<script type="text/javascript" src="./images/shCore.js"></script>
<script type="text/javascript" src="./images/shBrushCSharp.js"></script>
<script type="text/javascript">
SyntaxHighlighter.all();
</script>
<!--SyntaxHighlighter 끝-->
위의 스크립트 내용은 shBrushCSharp.js를 통해 C#코드를 입력할 예정이고
테마는 shThemeDefault.css를 이용해 기본 테마를 사용한다는 말
6. 사용법
HTML코드를 당연히 사용해야하므로 HTML 편집기를 활성화한 후에
<pre class="brush: csharp>
코드내용
</pre>
위와 같이 앞뒤로 설정해준 후 코드내용란에 본인의 코드를 넣으면 완성
7. 예제
<PRE class="brush: csharp">
public void ABC(string A)
{
string B = A + "C";
}
</PRE>
출력 내용은 아래와 같다.
public void ABC(string A)
{
string B = A + "C";
}
'컴퓨터 Computer > Software' 카테고리의 다른 글
| 야후의 플리커(Flickr) 어플 설치하기 (안드로이드) (0) | 2016.01.10 |
|---|---|
| Mircrosoft 공식 윈도우 USB 설치 툴 (0) | 2015.11.01 |
| 컴퓨터 관리프로그램[Advanced SystemCare 7 PRO] 제한적 무료 다운로드! (0) | 2014.09.25 |
| 윈도우 영문판 설치했을 때, 한글로 변경하는 방법 (0) | 2014.08.21 |
| [리뷰] 자전거 어플 "Strava" (3) | 2014.07.20 |