티스토리에서 소스코드 예쁘게 하이라이트 넣는법 - colorscripter 사용법

티스토리에서도 코드를 넣을 수 있는 기능을 지원하지만,

생각보다 투박한 느낌이 있다.

아래는 티스토리 Code 기능을 이용해서 넣은 소스코드다.

 

---

 

티스토리 코드블럭 기능을 이용해 넣은 코드

import java.util.Scanner;
public class OneHour {
       public static void main(String[] args) {
             Scanner sc = new Scanner(System.in);
             String input = sc.next();
             
             for (char c = 'a' ; c <= 'z' ; c++)
                    System.out.print(input.indexOf(c) + " ");
       }
}

어느 정도의 Highlighting 기능을 제공해주지만, 

템플릿이 썩 마음에 들지는 않았다.

 

 

Color Script를 통한 코드 하이라이팅

colorscripter.com/ 사이트에서는 코드를 입력하면 원하는 포맷에 맞는 코드 하이라이팅을 지원한다. 사용법은 아래와 같다.

 

1. 사이트 접속

colorscripter.com

Colorscripter 사이트에 접속한다.

 

 

 

2. 코드 입력 및 포맷 선택

코드 란에 코드를 입력하면 자동으로 언어를 감지해준다.

원하는 언어로 설정도 가능하다.

 

현재 스타일 패키지는 기본, 핑크레몬에이드, 서브라임 블랙을 지원한다.

개인적으로 서브라임 템플릿이 마음에 들어서 선택했다.

 

위와 같이 세부설정도 할 수 있다.

 

 

3. HTML 복사

 

웹페이지 오른쪽 하단을 보면 HTML로 복사라는 버튼이 있다. 해당 버튼을 누르면 HTML 코드가 생성된다.

 

 

4. HTML 티스토리에 붙혀넣기

 

작성하는 글의 모드를 HTML로 바꾼후 해당 코드를  붙혀 넣는다.

 

5. 완성

import java.util.Scanner;
public class OneHour {
       public static void main(String[] args) {
             Scanner sc = new Scanner(System.in);
             String input = sc.next();
             
             for (char c = 'a' ; c <= 'z' ; c++)
                    System.out.print(input.indexOf(c) + " ");
       }
}

그럼 위와 같이 코드 하이라이팅이 된 JAVA 소스코드가 보인다.