앞으로 본문에 코드를 많이 쓰게 될 예정이므로 Syntax Highlighting 을 적용하는 방법을 정리해본다.
1) Blogger's Admin Panel에서 Template메뉴를 클릭
2) Template 메뉴에서 현재 사용중인 디자인의 HTML 편집 클릭
3) 사용중인 Template의 html 코드가 나오는데 여기가 중요한 부분이다. Template 코드중 <head>와 ... </head> 사이에 아래의 코드를 넣도록 하자
윗 코드에서 추가되는 Javascript의 이름을 확인하여 실제로 사용하지 않을 Language는 삭제해서 페이지 로딩 속도를 줄이도록 하자. 나 같은 경우는 AS3, ColdFusion, Delphi등등 쓰지 않을 언어에 대한 부분은 모조리 삭제하였다.
4) 이제 수정된 Template 을 저장하고 테스트 삼아 아래의 글을 작성해보도록 하자.
/*
* SyntaxHighlighter
*/
function foo()
{
if (counter <= 10)
return;
// it works!
}
5) 미리 보기를 통해서 보면 이 블로그 글과 같이 코드 부분이 따로 처리되어 보이는 것을 알 수 있다. 코드 Language에 따른 brush값은 링크에서 확인 할 수 있다.
이 Syntax Highlighter에 대한 추가적인 정보는 원작자 사이트 중 링크에서 확인해보도록 하자.
한가지 팁을 더하자면 Syntax Highlighter 색상 Theme을 변경하기 위해서는 위에서 Template에 추가한 코드중 아래 CSS 파일 링크를 원하는 Theme의 파일 이름으로 수정하면 되는데, 사용가능한 Theme에 대한 정보는 링크를 참조하도록 하자.
덧. 한가지 주의점이 있는데
SortedListshouldRunAfterTimes;
위와 같이 코드에 <나 >와 같은 꺽쇠기호가 들어 있으면 문제가 있다.
이 경우는 SyntaxHighlighter가 <나 >와 같은 꺽쇠기호를 제대로 인식하지 못하기 때문인데, 이 경우에 <는 "<"로 >는 ">"로 바꿔서 올리면 된다.
SortedList<float, IEnumerator> shouldRunAfterTimes;
No comments:
Post a Comment