很久以前有寫一篇教學, 現在有發現更簡單的做法
就是引入 highlight.js
回歸到最簡單的做法
參考許多教學之後使用最簡易的做法
就是把底下幾行引入到 Blogger 範本內即可
<link href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.11.1/styles/default.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.11.1/highlight.min.js">
</script><script>hljs.highlightAll();</script>具體的位置就是打開 Blogger 之後將上面幾行放在 <head> 之前即可
然後在需要使用的地方加入以下 html tag
<pre>
<code class="language-[指定語言]">
[你的程式碼...]
</code>
</pre>
另外需要注意的是如果區塊內有使用到特殊符號
例如 <> 這種都需要先使用 HTML encoder 方式轉好再放進去, 不然會被編譯成 HTML tag 導致內容不正確
支援的程式語言可以看這裡 https://bit.ly/47Bt8qs
Ref.:
沒有留言:
張貼留言