티스토리 highlight.js / highlightjs-line-numbers 안될 때 해결 방법

 

본 포스팅은 highlight.js를 사용하는 방법을 모두 적용했음에도 티스토리 포스팅에 코드 하이라이팅이 제대로 되지 않을 경우 확인해 볼 사항들입니다.

(highlight.js,  highlightjs-line-numbers를 사용하기 위해 티스토리 스킨 편집에서 html태그, CSS, 파일 업로드 모두 했음에도 안 되는 경우)

 

 

1. highlight.js 테마가 적용이 안될 때

 

해결 방법

[블로그 관리] - [플러그인]

★티스토리 코드문법강조 플러그인 사용 해제

 

 

 

 

---

 

2. highlightjs-line-numbers CSS가 적용이 안될 때

 

발생 원인

티스토리 스킨의 테이블 CSS와 충돌하기 때문

 

해결 방법

★현재 사용중인 티스토리 스킨의 CSS에서 table 관련 CSS를 자식인 테이블의 경우만 속성을 사용하도록 변경

(본문에 바로 표가 나왔을 때만 적용되도록)

 

 

highlightjs-line-numbers를 적용해도 아래와 같이 나오는 경우

이미지 출처: https://url.kr/lAS3XF

 

[블로그 관리] - [꾸미기] - [스킨 편집] - [html 편집] -[CSS]

table 관련 CSS 처리

(스킨마다 CSS가 다르므로 table로 검색하여 관련 CSS 처리)

 

 

 

 

 

 

이 글을 작성하기 위해 참고한 사이트
https://url.kr/lAS3XF
https://meyouus.tistory.com/64