반응형
1. 공식 홈페이지 접속
https://highlightjs.org/download/
2. 언어 선택 뒤 다운로드
기본 언어는 체크되어 있으니 그냥 바로 중간에 있는 Download를 누르면 된다.
3. 파일 2개 업로드
1) 위치: 꾸미기-스킨 편집-html 편집-파일업로드
2) 파일:
highlight.pack.js
테마.css
테마.css는 styles폴더 안에 있으며 원하는 것을 골라 업로드하면 된다.
테마 미리보기는 이곳에서
https://highlightjs.org/static/demo/
4. html 파일에 코드 입력
<link rel="stylesheet" href="./images/테마.css">
<script src="./images/highlight.pack.js"?</script>
<script>hljs.initHighlightingOnLoad();</script>
5. 글쓰기
1) 방법1: 에디터에서 코드쓰기 버튼을 눌러 코드 입력
2) 방법2: 그냥 코드 입력 후 html모드에서 [pre][code]코드[/code][/pre] 이렇게 감싸주기
*에디터가 자꾸 코드로 자동변환해서 일단 <>를 []로 올림.
실제로는 <>로 올려야함.
글쓰기 상태에서는 예쁘게 안나오지만 글 완료를 누른 뒤 확인해보면
이렇게 예쁘게 나온다(테마는 agate로 함)
참고로 css나 jquery는 그대로 올리면 안되고,
각각 <style></style>과 <script></script>안에 써줘야지 정상적으로 인식된다.
'html_css' 카테고리의 다른 글
SCSS 기본 정리 (0) | 2020.12.09 |
---|---|
HTML 몰아서 정리 (0) | 2020.11.16 |
ul에다가 float했는데 순서 반대로 뒤바뀌었을때 (0) | 2019.10.01 |
가상 선택자(after, before)에 font awesome 아이콘 사용하기 (0) | 2018.08.15 |
html 자주 사용하는 특수 문자 리스트 (0) | 2018.06.28 |