티스토리 블로그 소스 코드 예쁘게 넣는 방법(feat. 소스 코드 숨기기)

활용 사이트

Color Scripter

 

사용 방법

① 언어 선택

그림1. 언어 선택

 

② 스타일 패키지 선택(추천 : 서브라임 블랙)

그림2. 스타일 패키지 선택

③ 오른쪽 하단 "HTML로 복사" 버튼 클릭 및 HTML 태그 복사

그림3. HTML로 복사 버튼 클릭

 

④ 티스토리 블로그 상단에서 기본 모드 → HTML로 변경

그림4. 티스토리 HTML 모드로 변경

SMALL

⑤ 복사한 HTML 태그를 원하는 위치에 넣은 후 다시 기본 모드로 변경

그림5. 원하는 위치에 HTML 태그 삽입

그림6. HTML 태그 삽입 완료 후 모습

그림7. 다시 기본모드로 복귀 후 모습

 

※ 추가 : 접은 글 이용해서 코드 숨기기(더보기 클릭하면 소스 보이게 하기)

① 접은 글 삽입 후 HTML 모드로 변경
② <P>~</P> 부분 대신 Color Scripter 사이트에서 복사한 소스코드 HTML 태그 삽입 

그림8. 코드 숨기는 방법