code-prettify : blogspot에 코드 삽입하기

blogspot은 네이버 블로그나 tistory처럼 코드 삽입 기능이 없다.

자체적으로 html에 태그를 넣어 코드를 삽입해야 한다.

blogger의 테마 설정에서 다음의 코드를 head에 넣어준다.

<script src="https://cdn.jsdelivr.net/gh/google/code-prettify@master/loader/run_prettify.js"></script>

테마 - HTML 편집으로 간다.

head태그 안에 넣어주고 저장한다.

스킨 고르는법

<script src="https://cdn.jsdelivr.net/gh/google/code-prettify@master/loader/run_prettify.js?skin=sons-of-obsidian"></script>

skin=에 원하는 스킨을 넣으면 된다. 스킨 예시: Prettify Themes Gallery (githack.com)

스킨은 소문자로 지정해야 정상적으로 작동된다.

사용법

<pre class="prettyprint lang-html">
  The lang-* class specifies the language file extensions.
  File extensions supported by default include:
    "bsh", "c", "cc", "cpp", "cs", "csh", "cyc", "cv", "htm", "html", "java",
    "js", "m", "mxml", "perl", "pl", "pm", "py", "rb", "sh", "xhtml", "xml",
    "xsl".
</pre>

pre태그에 .presstyprint와 .lang-{lang}을 지정해준다.

줄 번호 출력: .linenums를 추가해준다.

<pre class="prettyprint linenums lang-html">
  The lang-* class specifies the language file extensions.
  File extensions supported by default include:
    "bsh", "c", "cc", "cpp", "cs", "csh", "cyc", "cv", "htm", "html", "java",
    "js", "m", "mxml", "perl", "pl", "pm", "py", "rb", "sh", "xhtml", "xml",
    "xsl".
</pre>