2016년 11월 18일 금요일

구글 블로그에 Syntax Highlighter 적용하기

구글 블로그 > 디자인 > 템플릿 > HTML 편집에서

</head><body...>
헤드가 끝나는 앞 부분에 아래 코드를 넣어주면 된다.


<!-- Syntax Highlighter Additions START -->
<link href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.8.0/styles/default.min.css" rel="stylesheet"></link>
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.8.0/highlight.min.js"></script>
<script>hljs.initHighlightingOnLoad();</script>
<!-- Syntax Highlighter Additions END -->

사용법은
블로그에 글을 쓸때, 소스 부분은 HTML 을 누르고

<pre><code class="html">...</code></pre>

이런식으로 pre로 감싸주고 code 안에 내용을 쓰면 된다.
class 에는 php, html, css, sql, ini ... 자세한 사항은 아래 주소에서 확인할 수 있다.

https://highlightjs.org/download/

스타일은 여기서

https://github.com/highlightjs/highlight.js/blob/main/SUPPORTED_LANGUAGES.md
https://github.com/isagalaev/highlight.js/tree/master/src/styles

댓글 없음:

댓글 쓰기

플러터 단축키

1. 위젯 감싸기/벗기기 비주얼 스튜디오 :   Cmd + . 안드로이드 스튜디오 : Alt + Enter 2. 코드 정렬 비주얼 스튜디오 : Ctrl + S 안드로이드 스튜디오 : Ctlr + Alt + L 3. StatelessWidget ->...