검색결과 리스트
티스토리 소스코드에 해당되는 글 1건
- 2013.01.09 [꾸미기] 티스토리의 소스코드 꾸미기 - syntaxhighlighter 4
글
아래 손가락을 눌러주세요.
프로그래밍에 관한 포스팅을 할 때, 소스코드를 작성해야 할 경우가 많습니다. 각 편집툴마다 소스코드의 서식이 있는데 적용 안하고 포스팅하자니 가독성이 떨어지고.. 일일이 서식을 편집하자니 너무 힘들고..
그래서 이 문서에서는 손쉽게 서식을 적용하기 위한 방법을 소개합니다.
일반 소스코드를 간단히 붙여 넣어도 그림처럼 서식을 넣을 수 있습니다.
파일 업로드 및 HTML/CSS 편집 |
1. 아래 파일을 다운 받고 압축을 풉니다.
syntaxhighlighter_3.0.83.zipsyntaxhighlighter 사이트: http://alexgorbatchev.com/SyntaxHighlighter/
2. 티스토리 관리자모드에서 [꾸미기] - [HTML/CSS 편집] - [파일 업로드] 로 이동합니다. 아까 압축 풀었던 폴더에서 scripts 폴더와 styles 폴더에 있는 모든 파일을 업로드 합니다.
3. [HTML/CSS] 탭으로 이동합니다. skin.html 영역에서 밑줄 친 부분 아래에 첨부 된 파일을 다운 받아 소스를 추가합니다. <head> ~ </head> 부분입니다.
skin 소스코드서식1.txt
4. 마찬가지로 skin.html 에서 </body> 부분 위에 아래 파일을 다운 받아 코드를 추가합니다.
| syntaxhightlighter 사용 방법 |
글쓰기에서 html 모드에서 다음과 같은 형식으로 작성하시면 됩니다.
<pre class="brush:OOO">
~소스코드~
</pre>
적용 가능한 언어들의 종류입니다.
ex) brush:cpp, brush:java 등
코드의 스타일을 바꾸는 방법도 있습니다. skin 소스코드서식1.txt 파일에 있던 소스 중에서
<LINK rel=stylesheet type=text/css href="./images/shThemeEmacs.css"> 의
연두색 부분을 수정하시면 스타일이 바뀝니다.
스타일 종류는 styles 폴더에 있던 파일 이름들로 모두 가능합니다. ※ shCore.css 는 제외
티스토리에 syntaxhighlighter로 코드를 작성할 때 원하는 대로 작성이 안 될 때가 있습니다. 이러한 문제를 위해 아래 프로그램을 사용하면 해결할 수 있습니다. 견족자K 님 께서 개발하신 프리웨어입니다.
SHCC.exe'블로그 마케팅 > ㆍ꾸미기' 카테고리의 다른 글
| [꾸미기] 포스트의 제목을 물결 플래시로 꾸미기 (2) | 2013.01.09 |
|---|---|
| [꾸미기] 썸네일 이미지 링크 위젯 설치하기 - linkwithin (0) | 2013.01.09 |
| [꾸미기] 나눔고딕 웹 폰트 설치하기 (0) | 2013.01.09 |
| [꾸미기] 파비콘 만들기, 그리고 블로그에 적용하기 (0) | 2013.01.09 |
RECENT COMMENT