總瀏覽量

2013年11月29日 星期五

在動態blog上使用SyntaxHighlighter

最近要在我們team上的blog發表一些文章

不過那個blog選用的是用的是動態的template

因為內容是動態render出來的,所以SyntaxHighlighter的基本用法就不工作了

Google了一段時間

在stack overflow上找到了解法一

<pre class="brush: js" title="test" id="sh3-123">
var f = function () {
return 1;
};
</pre>

<script type="text/javascript">
// code snippet is loaded here, use SH3 API to highlight it
var element = document.getElementById('sh3-123');
SyntaxHighlighter.highlight(undefined, element);
</script>


基本上就是給pre標籤一個id再用SyntaxHighlighter API明確把syntax套上那個tag

這方法雖然work但是每貼一段code就要指定一個id感覺還是太繁瑣了

因此繼續google

然後找到了解法二

只要在blog中貼上上段javascript就可以讓原本語法恢復正常工作了

<script type="text/javascript">
SyntaxHighlighter.highlight();
</script>