티스토리에 코드 블럭 플러그 인이 있긴 하지만 원하는 테마가 없었다.
찾아봤더니 커스텀 테마 바꾸기는 스킨 변경에서 html코드를 추가해주면 되는데 이것도 되는 게 있고 안 되는 게 있더라.
base16이 앞에 붙어있는 애들은 거의 안됨. ㅜㅜ
아쉽게도 처음에 하고 싶었던 애는 base16-isotope이였는데 테마 적용이 안돼서 다시 찾아 선택한 애가 xt256 테마다.
테마가 질리게 될 경우, 다시 변경시켜야 되니까 나를 위해 코드 블럭 커스텀 테마 바꾸기 방법을 정리해 둔다.
1. 우선 밑에 사이트에 가서 원하는 테마를 찾는다.
https://highlightjs.org/static/demo/
We're not a CDN - highlight.js
Do not use us as a CDN. You should not be linking to any assets that are hosted on our website. We are getting million of garbage requests due to this misuse of our assets.
highlightjs.org
2. 테마 이름을 아래 html 코드에서 테마 이름 적을 자리에 넣어 둔다.
<!-- 원하는 테마로 커스텀 -->
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.2.0/styles/테마이름적을자리.min.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.2.0/highlight.min.js"></script>
<!-- load() -->
<script>hljs.initHighlightingOnLoad();</script>테마 이름에 띄어쓰기 가 있다면 - 이걸로 변경해서 적어준다.
base16으로 시작하는 애들은 다 실패했는데 혹시나 되는 분 계시면 댓글로 알려주세요!
3. 티스토리 블로그 관리로 가서 꾸미기 >> 스킨편집 >> html 편집 클릭
html 편집을 클릭해 준 다음 <head> 와 </head> 사이에 위에 있는 코드를 넣어준다.
나 같은 경우는 <head> 바로 밑에 넣거나 body로 가기 직전에 있는 </head> 바로 위에 넣는다.
내가 선택한 xt256 테마 이름을 위에 코드에서 테마 이름 적을 자리에 잘 넣어주고 적용하기 버튼을 눌러서 저장해 준다.
4. 글쓰기에서 더보기 >> 코드 블럭을 선택해 준 다음, 코드를 적고 확인 버튼을 누른 후, 미리 보기를 통해 잘 적용 됐는지 확인하면 끝.
혹시나 미리 보기를 했는데 내가 봤던 코드의 테마가 적용되지 않을 경우, html에 적은 코드에 문제가 있거나 선택한 테마의 이름이 문제일 수 도 있으니 일단 다른 테마 이름을 선택해서 넣어 보자.
5. 다 잘 넣었는데 선택한 테마 바뀌지 않을 경우, 혹시나 코드문법 강조 플러그인을 해제시키지 않았는지 확인해 보자.
블로그 관리에서 플러그인 >> 코드문법 강조 플러그인은 해제시켜 줘야 내가 적용한 플러그인으로 변경되니 플러그인이 해제되어있는지 다시 한번 확인하자.