2015年12月18日 星期五

highlight.js 和 blogger

highlight.js 
預設23種常用程式語言,有多種style,直接copy網站上給的範例貼上就能使用。
 預覽畫面:highlight.js demo
使用教學:How to use highlight.js


打開blogger後台,進入範本,點擊編輯HTML。
在Title標籤後一行(沒修改過大約是第8行)加入以下程式碼:

<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.0.0/styles/default.min.css"/>

<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.0.0/highlight.min.js"></script>

<script>hljs.initHighlightingOnLoad();</script>



日後要展示程式碼的部分,先在撰寫貼上程式碼,轉到HTML模式,用
<pre><code class="html">...</code></pre>
把程式碼包起來。


沒有留言:

張貼留言