안녕하세요 알통몬입니다. 공감 및 댓글은 포스팅 하는데 아주아주 큰 힘이 됩니다!! 포스팅 내용이 찾아주신 분들께 도움이 되길 바라며 더 깔끔하고 좋은 포스팅을 만들어 나가겠습니다^^
|
이번 포스팅에서는 프로그래밍 언어 포스팅을 할 때 소스 코드를 이쁘게 보여주는 syntahighlighter 를
플러그인 하는 방법에 대해 알아보겠습니다.
티스토리 블로그를 보다보면 아래와 같은 소스코드 프레임을 보셨을텐데요.
사용 방법입니다.
1. 아래 홈페이지에 들어가서 SyntaxHighlighter_1.5.1.rar 파일을 다운로드 해줍니다.
https://code.google.com/archive/p/syntaxhighlighter/downloads
2. 다운로드한 rar 파일의 압축을 풀어 Scripts, Styles 파일을 준비해줍니다.
3. 티스토리 블로그의 관리로 들어가서 꾸미기 탭의 HTML/CSS 편집에 들어갑니다.
4. 파일 업로드 탭에서 추가하기를 누른 후 Scripts, Styles 폴더 안에 있는 파일들을 전부 추가해줍니다.
5. HTML 탭에 들어가서
<head></head> 안에
<link rel="stylesheet" type="text/css" href="./images/SyntaxHighlighter.css"/>
태그를 추가해주고
<body> </body> 태그 안에 아래 코드를 추가해줍니다.
저장까지 하시면 기본 준비는 끝입니다.
이제 글쓰기에 들어가셔서 코드를 넣고 싶을 때 HTML 을 체크하셔서
<textarea name="code" class="cpp">
여기에 소스를 추가한다.
</textarea>
위 코드를 입력하고 코드를 추가하시면 됩니다.
class="원하는 언어"
위에서 class="원하는 언어" 에서 원하는 언어에 들어갈 언어 코드는 아래 사이트에서 확인하시면 됩니다.
https://code.google.com/archive/p/syntaxhighlighter/wikis/Languages.wiki
이상입니다.