728x90
1. 하단 링크에 접속한다.
2. get version 11.6.0 (2022.10.21기준) 클릭한다.
3. cdnjs, jsdelivr 둘중 하나를 선택하여 복사한다.
3-1. cdnjs
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.6.0/styles/default.min.css"> <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.6.0/highlight.min.js"></script> <script>hljs.initHighlightingOnLoad();</script> |
3-2. jsdelivr
<link rel="stylesheet" href="//cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.6.0/build/styles/default.min.css"> <script src="//cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.6.0/build/highlight.min.js"></script> <script>hljs.initHighlightingOnLoad();</script> |
<script>hljs.initHighlightingOnLoad();</script> 마지막줄에 꼭 추가를 해줘야한다.
4. 블로그 관리 - 꾸미기 - 스킨편집 - html편집을 누른다.
html 편집 목록을 보면 요소 위에 cdnjs, jsdelivr 둘 중 복사한 것을 붙혀넣기 해준다. ( 둘중 어느거든 상관없다.)
4-1 변경 전
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.6.0/styles/default.min.css"> <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.6.0/highlight.min.js"></script> |
- default 값을 제거하여 자신이 사용하고 싶은 테마를 선택해서 사용하면 된다.
- 테마 확인은 (https://highlightjs.org/static/demo/) 접속하여 Themes 에서 확인하면 된다.
4-2 변경 후
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.6.0/styles/atom-one-dark.min.css"> <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.6.0/highlight.min.js"></script> |
- Thems에는 atom one dark로 나와있지만 여백에는 하이픈(-)을 사용하도록 한다.
5. 코드블럭 생성하여 확인해보기
* 설명이 부족하거나 이해가 안가거나 추가 설명이 필요하면 댓글 부탁드리겠습니다.
728x90
'기타 > 티스토리' 카테고리의 다른 글
티스토리 스킨변경으로 메타태그 삭제되었을때 재등록 방법(구글 서치콘솔) (0) | 2022.10.22 |
---|