티스토리 코드 블록에 yaml 적용 방법

티스토리(tistory) 블로그에서도 다양한 코드 블록을 제공하지만 간혹 yaml과 같이 제공되지 않는 형식이 있어 답답하여 검색해 봤고 highlight.js를 알게 되었다. 추가 설치 등과 같은 번거로운 작업이 필요 없고 글 작성할 때 HTML 모드로 변경한 후 pre 태그를 조금 수정하면 된다. 아래 코드는 yaml 형식을 지정한 경우이다.

<pre id="code_1712543596141" class="yaml" data-ke-language="highlight.js" data-ke-type="codeblock"><code>

data-ke-language 속성에 highlight.js를 입력하고 class 속성에 yaml을 입력하면 된다. highlight.js를 이용해 티스토리에서 제공하지 않는 다양한 포맷들을 적용할 수 있다.

😉 highlight.js 깃허브 참고 : https://github.com/highlightjs/highlight.js/blob/main/SUPPORTED_LANGUAGES.md