본문 바로가기

javascript3

[코드 구문 강조 - highlight.js]3. highlight.js 줄 번호(line number), 가로 스크롤 추가 방법 이전 글은 여기서 확인해주세요. 1. 자신의 웹사이트(블로그)에 코드 구문 강조를 넣어보자(highlight.js 적용 방법) 2. highlight.js적용이 안 될 때(configure 옵션 설정 방법) 줄 번호(Line number)를 추가하는 방법 highlight.js에서는 공식적으로 줄 번호 표시 기능을 지원하지 않고 있습니다. 하지만, 일부 사람들이 플러그인으로 highlight.js에 줄번호가 나올 수 있는 라이브러리를 만들어 배포하고 있죠. 검색을 해보시면, highlighjs-line-numbers.js와 highlightjs-line-numbers.min.js가 많이 보이는데, 저는 highlightjs-line-numbers.min.js를 사용해보겠습니다. 아닌 경우도 있지만, 일반.. 2019. 4. 8.
[코드 구문 강조 - highlight.js]2. highlight.js적용이 안 될 때(configure 옵션 설정 방법) 1. 자신의 웹사이트(블로그)에 코드 구문 강조를 넣어보자(highlight.js 적용 방법) 3. highlight.js 줄 번호(line number), 가로 스크롤 추가 방법 highlight.js 적용이 안 돼요! - 문제점 파악하기 Tistory는 스킨 편집이 제공되는 몇 안 되는 블로그 서비스입니다. 스킨 편집이 제공되기 때문에, 스킨이 무궁무진하고, 다양하게 구현되어 사용되고 있죠. 블로그 서비스는 프로그램이라기보다는 웹 페이지이기 때문에, HTML/CSS 기반으로 구현이 되어있는데요, 이 HTML/CSS 디자인이, 하나의 페이지를 공통으로 사용하기 때문에, 의도가 다르거나, 중복되거나, 잘못 구현되면, 두더지 게임 잡듯이 하나 잡으면 다른 데서 튀어나오는 특징이 없지 않아 있어서 골치가 아.. 2019. 4. 6.
[코드 구문 강조 - highlight.js]1. 자신의 웹사이트(블로그)에 코드 구문 강조를 넣어보자(highlight.js 적용 방법) Tistory 에디터 편집기가 업데이트되었습니다. 코드를 넣으면 HTML로 구문 강조를 해주는 사이트를 이용하다가, Tistory 에디터가 업데이트되고 코드블럭을 사용해 봤더니, 너무 밋밋한 거 같네요. 하던 대로 외부에서 복사해서 붙여 넣기 해야지 하는데? 버그인지 의도인지는 모르겠지만, HTML 서식이 아직 복사가 안 되네요. IT 블로그가 많은 Tistory인데, 코드 강조 구문을 쓸 수가 없다? (구)에디터 만을 써야 한다? 말이 안 되죠. 그래서 확인해보니, 코드블럭에서 highlight.js 기능을 지원하고 있었습니다. 다른 코드 구문 강조도 적용할 수도 있지만, 여기서는 highlight.js를 심층 분석해보겠습니다. 2. highlight.js적용이 안 될 때(configure 옵션 설정 .. 2019. 4. 5.

티스토리툴바