카테고리 없음

티스토리 코드블럭 내가 원하는 언어로 설정하기.

hyuckkim 2021. 5. 3. 01:14

소금인형 - SW개발자? :: Tistory 티스토리 코드블록으로 작성 부분 highlight.js 적용하기 (edit.kr)

 

Tistory 티스토리 코드블록으로 작성 부분 highlight.js 적용하기

티스토리의 새로운 에디터의 "코드블록" 이라는 기능을 이용해서 코드를 넣었는데, 편집창과 보여지는 창이 다르게 나오는 것을 보고, 코드 하이라이트를 보여주는 highlight.js 는 사용자가 적용

blog.edit.kr

여기에 따르면 : 

Getting highlight.js (highlightjs.org)

 

Getting highlight.js

Hosted A prebuilt version of highlight.js with 39 commonly used languages is hosted by following CDNs: cdnjs jsdelivr unpkg You can find the list of commonly used languages below in the custom download form. For other available styles look into the highlig

highlightjs.org

여기서 맨 앞 코드의 두 줄 + 
<script>hljs.initHighlightingOnLoad();</script>

를 티스토리 html 편집의 </head> 부분 바로 뒤에.

 

코드를 두 곳에서 나누어 배끼는 이유는

버전이 계속 늘어나기 때문.

rust는 그래서 기본적으로 하이라이트가 안 된다.

 

 

글쓰기 메뉴에서만 정상 작동함!!

실제 글을 올리면 적용되지 않음!

내가 쓰려던 프로그래밍 언어가 없다.

CSS가 아니라 C;;

일단 아무렇게나 코드를 만들고,

 

HTML로 모드를 바꿔주자.

pre와 code가 있다.

 

id="code_1619971897951"건들면 문제 생길거 같으니 놔두고, class="css"랑 data-ke-language만 바꿔주자.

 

러스트는 class="rust" data-ke-language="Rust" 하니까 잘 되더라.

 

Code Blocks (readme.io)

 

Code Blocks

Tabbed Code Blocks ```javascript I'm A tabconsole.log('Code Tab A'); ```javascript I'm tab B console.log('Code Tab B'); Single Code Block console.log('a code block'); A tabbed interface for displaying multiple code blocks. These are written nearly identica

rdmd.readme.io

이 식 자체는 마크다운의 코드 표시를 이용하는 거 같으니까 여기 안에 있는 언어는 쓸 수 있지 않을까?