구글블로그(Blogger)에서 소스코드 이쁘게 올리는 방법(hilite.me)

안녕하세요 jay입니다
오늘은 구글블로그(Blogger)에서 소스코드 이쁘게 올리는 법을 알려드릴려고 합니다.
제가 앞으로 Python, java, C등
다양한 프로그래밍 언어를 블로그에 포스팅하려고 하는데
현재 Blogger에서 소스코드를 작성하게 된다면
제 설명 때문에 가독성이 많이 떨어지겠죠?
그렇다고 해서 제가 스크린샷으로 코드를 올릴 경우
여러분들이 복붙하기가 어렵겠죠?
그래서 제가 검색해보고 직접 적용한 결과
라는 사이트를 알게 되었습니다!
물론 유명한 hightlightjs도 있지만
구글블로그(Blogger) 특성 상
템플릿에 따라 적용되는 css와 javascript코드가
너무 다르기 때문에 적용하기가 어렵습니다.
저 같은 경우 디자인은 마음에 들었으나
java코드 사이의 간격이 너무 커서 수정하는 과정이 
너무 어려워서 중도 포기하게 되었습니다.
그래서 hilite.me를 사용하는 것이 적합합니다.
어쨌든 이제 사용하는 방법을 알려드리겠습니다.

1. 위의 사이트에 들어가시면 아래와 같은 화면이 나옵니다.
여기서 이제 여러분들의 해당 언어를 선택하시고
여러분들이 원하시는 만큼 css를 건들여주시면 됩니다.
다 설정하신 다음 Hightlight! 버튼을 클릭하시면 됩니다
그러면 아래 Preview에 여러분들이 작성한 코드가 이쁘게 나옵니다.

2. 그 후에 HTML 코드 전체를 복사한 다음
구글블로그(Blogger)에 글쓰기로 가셔서

상단 부분을 보시면 글쓰기/HTML이 보이십니다
여기서 HTML를 선택하시고
복사한 코드를 붙여넣기 하시면 끝입니다.
한 번 예시로 java문법으로 Hello World!를 찍어보겠습니다.

3. 아래 사진과 같이 코드를 작성해주시고
설정을 해주신 다음 복사를 해주시면?

짜잔! 저희가 원하는 디자인으로 코드가 나타납니다 간단하죠?
public static void main(String[] args) {
    System.out.println("Hello World!");
}

댓글

댓글 쓰기