비개발관련
티스토리 코드블럭 검은배경/ highlight / 글쓰기 하이라이트
Josiah
2022. 9. 4. 13:07
728x90
티스토리 새 에디터 코드블럭에 하이라이트 적용하기
티스토리가 업데이트되면서 코드블럭 기능이 생겼습니다. 하지만 기대를 안고 코드블럭으로 글을 발행해보면 정말 블럭만 등장합니다. 에디터에서는 하이라이트가 되는데, 막상 미리보기/발행
kutar37.tistory.com
//코드 블럭에 스타일을 추가합니다.
<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>
티스토리 관리자페이지에서 좌측 메뉴 > 꾸미기 > 스킨편집
우측 상단 스킨편집 아래 html편집 버튼 클릭
상단에 복사한 코드 추가
(default.min.css -> an-old-hope.min.css 로 선택한 스타일 변경)
줄 간격이 넓을 경우 기본(nomal)로 적용
//하이라이트 줄간격을 보통으로 설정합니다.
<style type="text/css">
.hljs {
line-height: normal;
}
</style>
하단에 highlight.min.js 스크립트 추가
적용을 누르고 새로고침을 해서 발행된 글( 작성된 글) 의 코드블럭의 스타일이 변경되었는지 확인한다.
